1.Mithril Emmet(代碼快速編寫工具)
Emmet前身是zen-coding
A.快速編寫HTML代碼
初始化.gif
內容.gif
分組.gif
id/class.gif
嵌套.gif
B.快速生成CSS樣式
css.gif
2.HTML Snippets
html提示.png
3.Debugger for Chrome
斷點調試工具
4.Path Intellisense
自動路由補全
路由補全.gif
5.beautify
格式化代碼的工具
6.vscode-fileheader
快捷鍵:ctrl+alt+i
頂部注釋,可定義作者、時間等信息,保存文件時自動更新最后修改時間。
7.Vue 2 Snippets
vue2 高亮 補全
8.Atom One Dark Theme
喜歡atom主題的可以下載,安裝過后,設置一下
設置.png
9.vscode-icon
圖標樣式,必備插件
安裝后,ctrl+shift+p調出命令行,輸入theme,選擇vscode-icon
theme.png
icon.png
10.特別好用的 Vue 插件 - vetur
代碼補全功能,綜合比較應該是目前 VSCode 上面最好用的 Vue 插件。
能夠實現在 .vue 文件中:
- 語法錯誤檢查,包括 CSS/SCSS/LESS/Javascript/TypeScript
- 語法高亮,包括 html/jade/pug css/sass/scss/less/stylus js/ts
- emmet 支持
- 代碼自動補全(目前還是初級階段),包括 HTML/CSS/SCSS/LESS/JavaScript/TypeScript
配合 ESLint(代碼規范和錯誤檢查工具)插件效果更佳。
11.CSS Auto Prefix(css兼容性前綴補全插件)
既可以用于縮進樣式,也可以用于單行CSS樣式。要激活它,只需在工作臺命令窗口中使用Ctrl + Shift + p,鍵入“Auto Prefix”。
demonstration.gif