好用的VSCode插件

一、 Error Lens

改进错误、警告和其他语言诊断的突出显示。如下：

二、koroFileHeader

用于生成文件头部注释和函数注释的插件

settings.json 设置如下：

"fileheader.configObj": {
   "createFileTime": true, //设置为true则为文件新建时候作为date，否则注释生成时间为date
    "autoAdd": true, //自动生成注释
    "annotationStr": {
        "head": "/*",
        "middle": " * @",
        "end": " */",
        "use": true
    },
},
"fileheader.cursorMode": {
    "description": "",
    "param ": "",
    "return": ""
},
"fileheader.customMade": {
    "Description": "", //文件内容描述
    "Author": "XXX", //编辑人
    "Date": "Do not edit", //时间
    "LastEditTime": "Do not edit",
    "LastEditors": "XXX",
},

三、Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code

适用于 VSCode 的中文语言（简体）扩展包

四、Auto Close Tag

自动闭合标签

五、open in browser

快速打开html文件到浏览器预览

六、Vetur

VSCode的Vue工具

七、background

用于设置VSCode的背景图

八、Auto Rename Tag

修改标签对的插件

九、CodeMetrics

计算 JavaScript 或者 TypeScript 文件复杂性

安装后会在文件中有这样的提示：

十、 EditorConfig for VS Code

用于格式化时对内容的排版

十一、es6-string-html

es6多行字符串中的语法高亮显示

十二、Formatting Toggle

文件保存代码格式化的开关，有些人不开代码格式化，导致你一改他的文件整个文件都变更了，就很烦人，有了这个开关，就可以便捷的控制当前文件保存时候要不要格式化。

十三、ES7+ React/Redux/React-Native snippets

与react、redux、graphQL、React-Native相关的代码片段，高效、高度可重用的代码片段

十四、GitLens — Git supercharged

通过Git注释和代码截图，一目了然地可视化代码创建，无缝地导航和探索Git存储库，可以清楚地知道是谁修改了当前的代码行，再也不用担心是谁移动了我的代码。

十五、HTML CSS Support

css智能提示类名或者id

十六、JavaScript (ES6) code snippets

es6 语法的代码片段，高效开发必备的语法片段

十七、jQuery Code Snippets

jQuery代码段

十八、Live Server

为静态和动态页面启动具有实时重载功能的开发本地服务器

十九、Open in Typora

可以在vscode中打开typora文件

二十、Path Intellisense

自动完成文件名、文件路径的 VS Code 插件

二十一、Prettier - Code formatter

基于更漂亮的代码美化vscode插件，这是工程的必备工具

二十二、px to rem & rpx & vw (cssrem)

一个可以在px和rem&rpx&vw单位之间转换的插件

二十三、Sass/Less/Stylus/Pug/Jade/Typescript/Javascript Compil

能识别出代码的关键词并进行关键词美化，支持Sass、Less、Stylus、Pug、Jade、Typescript、Javascript

二十四、vscode-icons

文件图标

二十五、npm Intellisense

在import语句中自动完成npm模块的插件