VScode 好用插件集合(一)
什么是VScode
Visual Studio Code (簡稱 VS Code / VSC) 是一款免費開源的現代化輕量級代碼編輯器，支持幾乎所有主流的開發語言的語法高亮、智能代碼補全、自定義快捷鍵、括號匹配和顏色區分、代碼片段、代碼對比 Diff、GIT命令 等特性，支持插件擴展，並針對網頁開發和雲端應用開發做了優化。軟件跨平台支持 Win、Mac 以及 Linux，運行流暢，可謂是微軟的良心之作......
VSCode 下載地址：https://code.visualstudio.com/
根據調查發現，VScode 和 sublime 是前端開發者比較喜歡的 IDE 。相對與這兩個軟件，我更喜歡的其實是 VSCode ，本博文就記錄一下比較好用的 VSCode 插件。
VSCode 插件
代碼快捷鍵
在 VScode 的首頁可以設置通用快捷鍵，因為平常用sublime比較多，所以干脆合並成一套。
代碼提示
Path Intellisense
自動路徑補全
Document this
js 的注釋模板 （注意：新版的 vscode 已經原生支持,在 function 上輸入 /** tab ）
代碼格式
ESlint
代碼規范，對不符合要求的代碼或者有語法錯誤的JS代碼進行提示，可以自定制提示規則。
HTMLHint
html代碼檢測。
beautify
格式化代碼的工具。
代碼可視化改善
colorize
可視化顏色哦，做組件涉及很多不同的主題，個人還是蠻稀飯的。
RegExp Preview and Editor
這個就厲害了.可以完美的展示你寫的正則,圖形化給你看你寫正則的形成。
Better Comments
最好用的注釋區域高亮,對於TODO這些支持也很好。
BreadCrumb in StatusBar
----------------------------------------------------------------------------
華麗麗的分割線，以下插件根據框架語言選擇，用什么裝什么，不用就不要裝了，浪費內存
React 插件
ES7 React/Redux/GraphQL/React-Native snippets
涵蓋的代碼片段賊豐富，React 相關代碼提示有這個就夠了。
Useful React Snippets
當然如果你只用React,那用這個代碼提示吧，管夠了。
CSS Blocks
支持 css 模塊化的智能提示，跳轉，牆裂推薦。
styled-components-snippets
styled-components 的代碼片段。
Vue 插件
vetur
語法高亮、智能感知、Emmet 等。
VueHelper
snippet 代碼片段。
Vue VSCode Snippets
很全面的vue代碼片段。
Node
eggjs
蛋框的相關幫助插件,代碼片段,智能提示等
egg-jump-definition
蛋框的函數跳轉：Cmd+4。
微信小程序
mpvue snippets
mpvue的一些代碼片段,以及部分原生小程序的代碼提示。
minapp
用VS Code寫小程序必備的插件,里面有眾多實用的特性集成。
Markdown 插件
Markdown All in One
Markdown 的提示插件用這一個足以，集成了語法快捷鍵、Math、預覽等，很實用。
markdownlint
對 markdown 的語法格式規范進行代碼提示。
代碼審查
CodeMetrics
可以計算TS/JS內代碼的復雜度(比如函數這些),這些與代碼質量和性能是掛鈎的。
Import Cost
就是你import一個東西的時候,可以計算改引入模塊的大小。
Git Lens
暫時沒有發現比這個看git記錄更為詳細了。
其他
面的插件可有可無，如有相應功能的需求，卻也是非常棒的插件。
fileheader
頂部注釋模板，可定義作者、時間等信息，並會自動更新最后修改時間。
ctrl+alt+i
Paste JSON as Code
JSON 格式轉換成其他的語言格式。
Node.js Modules Intellisense
對於 node_module 的智能提示 。
npm-import-package-version
顯示導入的 npm 包的版本信息
File Tree View
提供幾個常見編程語言的函數或狀態的樹集合展示,可以快速點擊跳轉!!
NPM-Scripts
在側邊欄可視化執行 npm 命令(項目內的package.json), 小巧實用.
:emojisense:
