VSCode插件推荐（前端）

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