这篇博客主要是我使用vscode过程中的插件汇总,使用了这么长时间,总想有个总结,也方便日后查看,这里我将我使用的插件分为基础、框架、工具三个类型。
# 官网地址
VSCode插件官网地址 (opens new window),里面有很多的插件可以使用。
# 基础插件
这部分插件主要是和html
、css
、js
有关的。
# html CSS Support
这个插件支持以下语言,提供基础的语法知识编写辅助。
- html
- laravel-blade
- razor
- vue
- pug
- jade
- handlebars
- php
- twig
- md
- nunjucks
- javascript
- javascriptreact
# HTML Snippets
这个插件主要是针对html的语法的,支持以下标签,插件地址 (opens new window)
- html5的全部标签
- 标签含义信息提示
- 一些描述性的语法
# HTMLHint
这个插件提供html的编写提示,包括到属性的格式监测,语法细致监测纠正,非常好的。插件地址 (opens new window)
# JavaScript (ES6) code snippets
这个插件就是js方面的内容,主要提供以下支持,插件地址 (opens new window)
- JavaScript (.js)
- TypeScript (.ts)
- JavaScript React (.jsx)
- TypeScript React (.tsx)
- Html (.html)
- Vue (.vue)
# ESLint
这个是有关js的语法监测插件,也很棒。插件地址 (opens new window)
# markdownlint
这个是提供markdown语法监测的插件,非常好用,帮助你养成良好的markdown编写风格。插件地址 (opens new window)
# 框架插件
这部分插件主要是和各个框架有关的插件,比如jquery,bootstrap,vue等ui框架,html模板引擎和js框架。
# EJS language support
这是一个非常好用的html模板引擎插件,提供ejs的用法。
- if
- for
- 插值
- ...
# jQuery Code Snippets
虽然jQuery诞生于2006年,距今已有13年历史,但是还是有很多人在使用,所以也推荐一下。插件地址 (opens new window)
提供以下方法:
- func
- jqAfter
- jqAjax
- jqAjaxAspNetWebService
- jqAppend
- jqAppendTo
- jqAttrGet
- jqAttrRemove
- jqAttrSet
- jqAttrSetFn
- jqAttrSetObj
- jqBefore
- jqBind
- jqBindWithData
- jqBlur
- jqChange
- ...
# vetur
这个是vuejs官方团队的一名成员写的有关vuejs语法的插件,强力推荐。插件地址 (opens new window)
- Syntax-highlighting
- Snippet
- Emmet
- Linting / Error Checking
- Formatting
- Auto Completion
- Debugging
# Vue 2 Snippets
这个也是vue的语法插件,也作为补充插件。插件地址 (opens new window)
# 工具插件
这部分插件主要是日常工作过程中的一些工程化编译,构建还有辅助等工具,辅助编程。
# Auto Rename Tag
这是一款有关html标签的工具,具有自动重命名标签的功能,插件地址 (opens new window)
# Beautify
这是一款代码格式化的插件,可以对你写的代码进行格式调整,使得代码易读,规整,好看。插件地址 (opens new window)
# cssrem
这是一款有关css的px和rem转换的工具插件,方便移动端网页设计稿开发。插件地址 (opens new window)
# korofileheader
这是一款给js函数方法添加参数注解的插件。插件地址 (opens new window)
# filesize
这是一款计算每个文件大小的插件,方便你对你的代码量进行可视化观察,及时缩小代码量,提供代码质量。插件地址 (opens new window)
# JSON Tools
这是一款有关json数据格式化的插件,可以压缩和解压格式化json代码。插件地址 (opens new window)
- Ctrl(Cmd)+Alt+M,格式化json数据
- Alt+M,压缩json数据
# Live Server
这是一款可以提供http协议服务的插件,可以使用http进行访问本地网页,而且是实时更新内容。插件地址 (opens new window)
# Material Icon Theme
这是一款Material主题风格的图标插件,涵盖了大多数文件对应的图标,非常容易识别确认。插件地址 (opens new window)
# Minify
这是一款代码压缩插件,可以对html,css,js代码进行压缩,就像webpack打包工具那样压缩你的代码,使代码体积变小,打开速度加快。插件地址 (opens new window)
默认是压缩以后,生成一个原来名字后加.
的文件,里面是压缩后的代码,比如:example.html
压缩后的名字变为example.min.html
。
# npm
这个插件主要是用来管理npm包的,可以在编辑器内下载,安装,查询,卸载npm包,非常方便。插件地址 (opens new window)
# open in browser
这个插件是在默认游览器打开你的网页,可以预览,但是需要手动刷新内容。插件地址 (opens new window)
# Path Intellisense
这个插件具有自动补全功能,非常方便。插件地址 (opens new window)
# easysass
这个插件是一个sass编译工具,方便书写sass代码。插件地址 (opens new window)
# Sass Lint
这个是和sass配套的一个插件,检查sass语法是否正确,插件地址 (opens new window)
# vscode-fileheader
这个插件可以在文档顶部插入一段说明注释,非常便于你查看当日写了哪些内容,插件地址 (opens new window)
# webpack
这个插件是一个webpack的辅助工具,可以创建webpack配置文件的,还有babel编译帮助功能,插件地址 (opens new window)
# 最后
这就是我日常使用的一些vscode的插件,在此作为一个汇总,方便日后查看。