VSCode插件推荐(前端)
2017-08-09 本文已影响1079人
Keiko_Yen
1.Mithril Emmet(代码快速编写工具)
Emmet前身是zen-coding
A.快速编写HTML代码





B.快速生成CSS样式

2.HTML Snippets

3.Debugger for Chrome
断点调试工具
4.Path Intellisense
自动路由补全

5.beautify
格式化代码的工具
6.vscode-fileheader
快捷键:ctrl+alt+i
顶部注释,可定义作者、时间等信息,保存文件时自动更新最后修改时间。
7.Vue 2 Snippets
vue2 高亮 补全
8.Atom One Dark Theme
喜欢atom主题的可以下载,安装过后,设置一下

9.vscode-icon
图标样式,必备插件
安装后,ctrl+shift+p调出命令行,输入theme,选择vscode-icon


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”。
