一、代碼片段類插件
英文叫做 Snippets，就是把常見的代碼模式抽出來，通過 2~3 個鍵就能展開 N 行代碼。
VS Code JavaScript(ES6) snippets
當前最流行的，已有超過 120 萬的下載量。這個插件為 JavaScript、TypeScript、HTML、React 和 Vue 提供了 ES6 的語法支持；
React-Redux ES6 Snippets
jQuery Code Snippets
二、自動補全類插件
Path Intellisense
自動路勁補全
Visual Studio IntelliCode
從 GitHub 上高星的開源項目經過大量的機器學習訓練，給開發者提供最合適的 IntelliSense 上下文建議功能，除此之外，還有代碼格式化和規則推測等功能。
Npm Intellisense
用於在import語句中自動填充npm模塊
IntelliSense for CSS class names
智能提示 css 的 class 名，目前也沒有用
Vetur
Vue 的語法高亮、智能感知、Emmet 等；
Surround
在你的代碼塊中增加外包裹模板
htmltagwrap
可以在選中HTML標簽中外面套一層標簽
使用方法：選中要包裹的代碼，快捷鍵Alt+w，默認外包裹標簽為p，可以在設置里搜索htmltagwrap將外包裹標簽改為div
Image Preview
鼠標懸浮在鏈接或者裝訂線(gutter)左邊可以預覽到圖片
HTML CSS Support
讓 html 標簽上寫class 智能提示當前項目所支持的樣式。目前沒有用，可能是因為當前作者的開發模式是html和css分開文件開發的。
三、功能增強插件
Debugger for Chrome
讓 vscode 映射 chrome 的 debug 功能，靜態頁面都可以用 vscode 來打斷點調試，需要另外配置，有點麻煩；
Project Manager
在多個項目之前快速切換的工具
工程項目過多時，shift+cmd+p(shift+ctrl+p) 然后輸入project，第一次選擇edit Project編輯自己的工程項目，之后就可以直接選擇open打開你的項目
jumpy
通過快捷鍵快速跳轉至某一個位置，對windows來說沒什么用
language-stylus
為Stylus文件添加語法突出顯示，stylus是 CSS 的預處理框架
code spell checker
檢查你的英文單詞拼寫是否有誤，如果有庫里不存在的單詞則會下下波浪線
Settings Sync
Visual Studio代碼設置同步，需要github賬號輔助的
JS Refactor
自動重構工具，目前沒發現沒怎么用
turbo console log
自動編寫有意義的日志消息
以下是作者本人的快捷鍵設置
turboConsoleLog.displayLogMessage //control+option+L change case
雖然 VSCode 內置了開箱即用的文本轉換選項，但其只能進行文本大小寫的轉換。而此插件則添加了用於修改文本的更多命名格式，包括駝峰命名、下划線分隔命名，snake_case 命名以及 CONST_CAS 命名等。
在快捷鍵配置中配置
extension.changeCase.camel //快捷鍵設置為ctrl+alt+u /commond+option+u將下划線轉駝峰 extension.changeCase.snake //快捷鍵設置為alt+u /control+option+u 將駝峰轉為下划線 四、markdown相關插件
Markdown All in One
讓vscode支持markdown .md文件
Markdown Preview Enhanced（未用）
實時預覽markdown，markdown使用者必備
markdownlint
markdown語法糾錯
五、Git相關插件
GitLens
豐富的 git 日志插件，非常強大，具體看官方介紹或者https://segmentfault.com/a/1190000015360390
Git blame
blame是追溯的意思，查看當前文件歷史上誰修改過
編輯器左下角能看到是最近一次的編輯信息，點擊右下角彈窗可直接打開網頁gitlab，查看提交記錄
.Git History
以圖表的形式查看以及根據條件搜索git日志
在當前文件右鍵點擊Git:viewFileHistory，就能查看當前文件的所有提交信息，並且支持篩選，搜索。
gi
gi是gitignore縮寫，它可以在Visual Studio Code內部生成.gitignore文件的擴展。gi使用gitignore.io API來更新操作系統，IDE和編程語言列表。
六、代碼檢測相關插件
ESlint
ESlint 接管原生 js 提示，可以自定制提示規則；
TSLint
Regex Previewer
這是一個用於實時測試正則表達式的實用工具。它可以將正則表達式模式應用在任何打開的文件上，並高亮所有的匹配項。
在並排文檔中顯示當前正則表達式的匹配項
七、美化編輯器類
Bracket Pair Colorizer
讓括號擁有獨立的顏色，易於區分。可以配合任意主題使用
使用結果：
vscode-icon
讓 vscode 資源樹目錄加上圖標
color highlight
Output Colorizer
輸出提示的文字顏色有一些變化，方便獲取關鍵信息
Guides
指導線，當前所在的級別縮進線會變紅，當前在哪一級一目了然。
Log File Highlighter
日志文件(.log后綴的文件)高亮
八、其他
Laravel goto view
跳轉到相應的文件路徑
open in browser
當前的 html 文件用瀏覽器打開，快捷鍵alt+b，或者右鍵點擊html文件，選擇open in default Browsers
sass
TypeScript Hero
Remote
遠程開發用的
TODO相關
Todo Tree
TODO Highlight
能夠在你的代碼中標記出所有的 TODO 注釋，以便更容易追蹤任何未完成的業務
提示類
Import Cost
在編輯器中顯示引入包的大小
filesize
在底部狀態欄顯示當前文件大小，點擊后還可以看到詳細創建、修改時間
Quokka.js
實時觀看 javascript 的變量的變化
先shift+cmd+p （ctrl+shift+p）輸入 quokka 選擇 new javascript 就行了
CSS peek
使用此插件，你可以追蹤至樣式表中 CSS 類和 ids 定義的地方。當你在 HTML 文件中右鍵單擊選擇器時，選擇“ Go to Definition 和 Peek definition ”選項，它便會給你發送樣式設置的 CSS 代碼。
注釋類
1.Better Comments
使注釋有人性化的高亮顯示
使用方法：
/** * 我的方法 * *重要的信息會被高亮顯示 * !及其反對的代碼,不要使用 * TODO 重構此方法 * @param 該方法的參數 */ 
Document This
快速注釋
fileheader
頂部注釋模板，可定義作者、時間等信息，並會自動更新最后修改時間
ctrl + alt + i你可以在頭部插入注釋，ctrl + s保存文件后，自動更新時間和作者。
圖片相關
SVG Viewer(目前還沒用)
無需離開編輯器，便可以打開 SVG 文件並查看它們
