1、Chinese (Simplified) Language Pack for Visual Studio Code 漢化包
2、One Dark Pro 一個暗黑系的主題
3、ESLint 代碼校驗
4、prettier-code formatter 代碼格式化
5、Material icon theme 美化code文件圖標
6、vetur 讓code支持vue文件
7、auto close tag 自動添加閉合標簽
8、auto rename tag 修改標簽名時同步修改配對標簽
9、Beautify 美化javascript、JSON、CSS、Sass和HTML
10、filesize：顯示焦點文件的大小
11、Path Intellisense 在引入外部文件時自動完成文件名
12、JQuery Code Snippets 對書寫JQ代碼提供提示
13、vue-helper 增強了編寫vue和擴展元素的能力，並支持ctrl+鼠標左點擊函數跳轉 —— 在保存時可能會導致卡住，反應很慢，不知道是電腦配置低還是插件問題，暫時卸載了
以上是目前在用的插件，下面有配套的setting內容。目前用着挺順手
{ "workbench.startupEditor": "none", // 控制啟動時顯示的編輯器 "workbench.sideBar.location": "left", // 控制側邊欄和活動欄的位置。它們可以顯示在工作台的左側或右側。 "workbench.editor.enablePreview": false, //打開文件不覆蓋 "workbench.colorTheme": "One Dark Pro", // 指定用在工作台中的顏色主題 "workbench.iconTheme": "material-icon-theme", // 指定工作台中使用的文件圖標主題；若指定為 "null"，則不顯示任何文件圖標 "explorer.confirmDelete": false, // 控制資源管理器是否在把文件刪除到廢紙簍時進行確認 "files.eol": "\n", // 默認行尾字符 "emmet.triggerExpansionOnTab": true, // tab鍵補全標簽及標簽提示,啟用后，按下 TAB 鍵，將展開 Emmet 縮寫 "editor.detectIndentation": false, // 控制是否在打開文件時，基於文件內容自動檢測 "editor.tabSize": 2, // 一個制表符等於的空格數 "editor.fontSize": 20, // 設置字體大小 "editor.renderWhitespace": "none", // 控制編輯器在空白字符上顯示的內容 "editor.lineNumbers": "on", "editor.wordWrap": "on", // 控制換行方式 on:將在視區寬度處換行 "editor.wordWrapColumn": 200, // 控制編輯器的折行列 "editor.snippetSuggestions": "bottom", // 控制代碼片段是否與其他建議一起顯示及其排列的位置 "editor.autoClosingBrackets": "beforeWhitespace", // 控制編輯器是否在左括號后自動插入右括號 "editor.autoClosingQuotes": "beforeWhitespace", // 僅當光標位於空白字符左側時，才自動閉合引號。 "editor.codeActionsOnSave": { "source.fixAll.eslint": true }, // 每次保存的時候將代碼按eslint格式進行修復 "editor.formatOnSave": true, // 在保存時格式化文件。 "editor.minimap.enabled": false, // 控制是否顯示縮略圖 "editor.quickSuggestions": { "other": true, "comments": true, "strings": true }, //開啟自動顯示建議 "vetur.format.defaultFormatter.html": "js-beautify-html", //格式化.vue中html "vetur.format.defaultFormatter.js": "vscode-typescript", //讓vue中的js按編輯器自帶的ts格式進行格式化 "vetur.format.defaultFormatterOptions": { "js-beautify-html": { "wrap_attributes": "auto" } }, "path-intellisense.autoSlashAfterDirectory": true, // 是否自動添加斜杠后的目錄 "path-intellisense.showHiddenFiles": false, // 是否顯示隱藏文件 "path-intellisense.extensionOnImport": false, // 是否向import語句添加文件擴展名 // 使能每一種語言默認格式化規則 "[html]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[css]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[json]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[javascript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "prettier.disableLanguages": ["vue"], // 不格式化vue文件，vue文件的格式化單獨設置 "prettier.singleQuote": true, // 如果為 true，將使用單引號而不是雙引號 "prettier.semi": false, // 是否在每行末尾添加分號 "prettier.printWidth": 900, // 指定每行代碼的最佳長度， 如果超出長度則換行。 "prettier.trailingComma": "none", // 控制尾隨逗號的輸出 "prettier.arrowParens": "avoid", // 當箭頭函數只要一個參數時去掉括號 "prettier.bracketSpacing": true, "todo-tree.tree.showScanModeButton": false // 在對象，數組括號與文字之間加空格 "{ foo: bar }" }