VSCode插件推薦（Web前端開發均適用）

衆多插件裏不免有幾個功能相近的，選一個合適本身的就行了，我會按照本身的習慣標上(推薦)~

這會不按期更新，若是大家有什麼好用的插件，也能夠在評論區推薦，我會試用後添加上去的，謝謝大家啦

插件列表

名稱	簡述
Auto Close Tag	自動閉合HTML標籤
Auto Import	Typescript或TSX中自動import提示
Auto Rename Tag	修改HTML標籤時，自動修改匹配的標籤
Beautify	美化格式化代碼，可經過自行配置.jsbeautifyrc自定義
Better Align	對齊賦值符號和註釋
Better Comments	編寫更加人性化的註釋（推薦）
Bookmarks	給代碼行添加書籤，快速換切
Code Runner	運行選中代碼段（支持大量語言）
Code Spellchecker	單詞拼寫檢查
Can I Use	HTML五、CSS三、SVG的瀏覽器兼容性檢查
Color Highlight	顏色值在代碼中高亮顯示
Color Info	小窗口顯示顏色值，rgb,hsl,cmyk,hex等等
Color Picker	拾色器
Debugger for Chrome	調試Chrome
ESLint	ESLint插件，高亮提示
Git History	查看git log
IntelliSense for CSS class names in HTML	CSS class提示
HTML CSS Support	css提示（支持vue）
HTMLHint	HTML語法格式提示
Import Cost	行內顯示導入（import/require）的包的大小
JavaScript (ES6) code snippets	ES6語法代碼提示
JSON Tools	格式化和壓縮JSON
Log Wrapper	生成所選中變量的打印語句(console.log('name' + name))
Output Colorizer	彩色化輸出框中的信息
Partial Diff	對比兩段代碼或文件
Path Intellisense	路徑完成提示
Prettier	格式化代碼（html,js,css,vue...） （推薦）
Prettify JSON	格式化JSON
Project Manager	多個項目間管理
Quokka.js	不須要手動運行，行內顯示變量結果
REST Client	直接在編輯器中發送REST風格的HTTP請求，並顯示返回http信息
Sass	sass插件
Settings Sync	VSCode設置同步到Gist
Stylelint	css/sass/less代碼風格規範
Version Lens	package.json文件顯示模塊當前版本和最新版本
VueHelper	Vue2代碼段提示（包括Vue2 api、vue-router二、vuex2）
npm Intellisense	導入模塊時，提示已安裝模塊名稱
Vetur	Vue語法高亮
vscode-icons	文件圖標，方便定位文件
View In Browser	快讀打開瀏覽器Ctrl+F1

我的的VSCode首選項設置（僅供參考）

{
  "editor.tabSize": 2,
  "files.associations": {
      "*.vue": "vue"
  },
  "eslint.autoFixOnSave": true,
  "eslint.options": {
      "extensions": [
          ".js",
          ".vue"
      ]
  },
  "eslint.validate": [
      "javascript",
      "javascriptreact",
      "vue",
      "vue-html"
  ],
  "search.exclude": {
      "**/node_modules": true,
      "**/bower_components": true,
      "**/dist": true
  },
  "emmet.syntaxProfiles": {
      "javascript": "jsx",
      "vue": "html",
      "vue-html": "html"
  },
  "git.confirmSync": false,
  "window.zoomLevel": 0,
  "vsicons.projectDetection.autoReload": true,
  "typescript.check.tscVersion": false,
  "editor.renderWhitespace": "boundary",
  "editor.cursorBlinking": "smooth",
  "workbench.colorTheme": "Solarized Light",
  "workbench.iconTheme": "vscode-great-icons",
  "editor.minimap.enabled": true,
  "editor.minimap.renderCharacters": false,
  "tslint.autoFixOnSave": true,
  "editor.fontFamily": "'Droid Sans Mono', 'Courier New', monospace, 'Droid Sans Fallback'",
  "beautify.tabSize": 2,
  "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}",
  "typescript.extension.sortImports.maxNamedImportsInSingleLine": 5,
  "typescript.extension.sortImports.omitSemicolon": true,
  "editor.codeLens": true,
  "editor.snippetSuggestions": "top",
  "react-native-storybooks.port": 6006
}