工欲善其事，必先利其器，想要达成高效的开发指标，怎么能短少了适合的编辑器插件呢。通过近期开发的几个我的项目，我养成了本人的开发习惯，这里就分享一些好用的vs code插件给大家。

第一款，Auto Rename Tag，这款插件能够在你扭转标签名称的时候主动重命名对称的标签。

第二款，Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code，名字尽管长，但其实是一个vs code汉化插件，对于英文苦手来说本地化的界面可能更好的上手。

第三款，code settings sync，这款插件能够通过gitee同步咱们的vscode配置，实用于那些常常在多台电脑之间切换应用或者常常重装系统的敌人，具体的配置办法能够参考 ，这里不做赘述。

第四款，ESLint，是一款赫赫有名的代码规范性检测插件，可能给你的代码规范性保驾护航，还能够依照我的项目外面.eslintrc.js的配置来自定义检测形式。

第五款，Live Server，相似于open in browser，能够将你的我的项目右键用浏览器关上，与open in browser不同的是，它是在本地启用一个服务器来运行你的我的项目，因而在你保留时能够实时预览，十分不便，毛病是敞开vs code之后网页也会生效，因为它是随着vs code外面的终端一起运行的。

第六款，One Dark Pro，本篇介绍中惟一一款非功能性插件，它是用来丑化编辑器外观的，应用前正文文本是有点儿晃眼的绿色，装上这款插件后正文文本变成了容易疏忽的浅灰色，各种标签和变量也有各自的色彩，不容易混同，同时它还集成了Material Icon Theme的性能，左侧文件列表中的不同文件也有了不同的图标，而这一款插件也有三种不同的对比度模式，装置插件后在插件的详情页面点击“设置色彩主题”即可抉择。

第七款，Prettier ESLint，这款插件能够依照ESLint的标准格式化代码，应用时须要在设置中编辑settings.json的eslint.options我的项目，具体的设置阐明稍后会在文末给出。

第八款，Settings Sync，与后面的code settings sync类似，欠缺了了vs code本身的同步性能，这款插件应用微软账户或者github账户来同步，因其同步应用的服务器地址不在国内，比拟适宜重度github用户来应用，具体的教程能够看这里 Settings Sync 应用教程 ，教程中有一点没提到的是生成tokens的时候记得把默认的30days改成no expriation。

第九款，Vetur ，能够用来提醒vue代码的高亮，同样相似的插件还有Vue 3 Snippets ，能够对vue2和vue3的代码进行主动补全，VueHelper ，能够将vue编写的代码给出提醒，敌人们能够自行抉择，我本人是把三款插件全副都装置了，享受三倍的高兴~

最初，大家有什么比拟得心应手的插件也能够分享在评论区，文中有表述谬误或者有疑难的也能够提出来，不吝赐教。
附：自己Prettier ESLint设置代码如下

{    "update.enableWindowsBackgroundUpdates": false,    "update.mode": "none",    "window.zoomLevel": 2,    "workbench.colorTheme": "One Dark Pro",    "sync.gist": "58510748d9d691bd67101073cf3e1064",    "editor.formatOnSave": true,    "diffEditor.ignoreTrimWhitespace": true,    "javascript.format.enable": false,    "typescript.format.enable": false,    "vetur.format.enable": false,    "eslint.enable": true,    "eslint.run": "onType",    "eslint.options": {        "extensions": [            ".js",            ".vue",            ".jsx",            ".tsx"        ]    },    "editor.codeActionsOnSave": {        "source.fixAll.eslint": true    }}

应用办法为点击编辑器左下角齿轮按钮，抉择“设置”，点击右上角“关上设置（json）”图标，备份好本人的设置代码之后，将以上内容粘贴进settings.json设置文件即可。

因为json文件无奈增加正文，这里逐行解释下每行代码的意思：

{//窗口后盾更新    "update.enableWindowsBackgroundUpdates": false,//vscode更新提醒/自动更新    "update.mode": "none",//窗口缩放等级    "window.zoomLevel": 2,//工作区主题配置    "workbench.colorTheme": "One Dark Pro",//code settings sync插件的配置    "sync.gist": "58510748d9d691bd67101073cf3e1064",//保留时主动格式化代码    "editor.formatOnSave": true,//主动去除代码间空行    "diffEditor.ignoreTrimWhitespace": true,//js文件的格式化    "javascript.format.enable": false,//ts文件的格式化    "typescript.format.enable": false,//vetur插件的配置    "vetur.format.enable": false,//eslint插件的配置    "eslint.enable": true,//eslint在每输出一个字符后检测是否有谬误/不标准    "eslint.run": "onType",//Prettier ESLint插件的配置    "eslint.options": {//主动格式化的文件类型        "extensions": [            ".js",            ".vue",            ".jsx",            ".tsx"        ]    },//保留时主动依照eslint标准修复谬误/不标准    "editor.codeActionsOnSave": {        "source.fixAll.eslint": true    }}