原文地址:https://segmentfault.com/a/1190000006697219
VScode現在已經越來越完善。性能遠超Atom和webstorm,你有什么理由不用它?
在這里，我會給你們推薦很多實用的插件，讓你對 vscode 有更深刻的體會，漸漸地你就會知道它有多好用。
走馬觀花前，請先將你的 vscode 更新到最新版本。
通用插件
HTML Snippets
超級實用且初級的 H5代碼片段以及提示
HTML CSS Support
讓 html 標簽上寫class 智能提示當前項目所支持的樣式
新版已經支持scss文件檢索
Debugger for Chrome
讓 vscode 映射 chrome 的 debug功能，靜態頁面都可以用 vscode 來打斷點調試，真666~
配置稍微復雜一些，哪天心情好我再另寫教程吧~
jQuery Code Snippets
jquery 重度患者必須品，廢話不多說，上圖
vscode-icon
讓 vscode 資源樹目錄加上圖標，必備良品！
Path Intellisense
自動路勁補全，默認不帶這個功能的，趕緊裝
Npm Intellisense
require 時的包提示（最新版的vscode已經集成此功能）
Document this
js 的注釋模板 （注意：新版的vscode已經原生支持,在function上輸入/** tab）
ESlint
ESlint 接管原生 js 提示，可以自定制提示規則。這個比較高玩，不會的就算了，
詳情配置請看我的另一篇文章 https://segmentfault.com/a/11...
HTMLHint
html代碼檢測
Project Manager
在多個項目之前快速切換的工具
beautify
格式化代碼的工具
Bootstrap 3 Sinnpet
常用 bootstrap 的可以下
Atuo Rename Tag
修改 html 標簽，自動幫你完成尾部閉合標簽的同步修改，不過有些bug。
GitLens
豐富的git日志插件
fileheader
頂部注釋模板，可定義作者、時間等信息，並會自動更新最后修改時間
filesize
在底部狀態欄顯示當前文件大小，點擊后還可以看到詳細創建、修改時間
Bracket Pair Colorizer
讓括號擁有獨立的顏色，易於區分。可以配合任意主題使用。
Vue插件
以下推薦vue框架所需的插件
vetur
語法高亮、智能感知、Emmet等
VueHelper
snippet代碼片段
Import Cost
引入包大小計算,對於項目打包后體積掌握很有幫助
主題
Material
冷門、好看、實用。此主題已停更許久
Dracula
目前我覺得是vscode上最漂亮的主題,vscode 1.11+允許自定義statusBar等全局ui后,該主題也跟進改了很多小細節,良心!~
One Dark Pro
源於Atom,老版本的Atom One Dark主題可以扔了.
最近有坑的組件，千萬不要更新
Image Preview
代碼中有圖片地址時，會實時閱覽圖片的功能，最近更新0.21.0版本會拖慢整個vscode，甚至代碼提示都卡住彈不出來了。
所以趕緊卸載或者禁用整個插件吧。等后續作者更新再看看.
github反饋 https://github.com/kisstkondo...
對前端感興趣的小伙伴，可以關注我一起討論哦！
GitHub https://github.com/Moerj