vscode的前端使用

我也算使用过很多款编辑器了，sublime、WebStorm、Hbuilder、atom、vscode...

• sublime
  小巧，打开速度快，基本没有什么预装功能，安装插件等大一点的功能比较不方便，平常用于快速查看文件倒是可以

• WebStorm
  就是大型的IDE，收费，过于多的功能，学习过程长，使用不算便利，每个项目还会生产配置文件，感觉不太舒服

• Hbuilder
  跟WebStorm差不多，毕竟是基于Eclipse开发而成，除了用于HyBrid的打包外，其他的对于我们前端来说没必要，同时打开速度是最慢

• atom
  GitHub开发的IDE，开始沉迷过一段时间，毕竟样子好看，还兼容JavaScript，前端就能编写IDE的插件样式等等，很有趣。但毕竟是工作用的，也不太需要这么多有趣的功能，底层不是C也不是Java这导致了速度上还是有点问题的，（其实已经优化得很好了）在一次我打开大文件时就崩溃了，或者格式化大文件时也崩溃了，这使我不得不放弃

• vscode
  不用被Visual Studio吓到了，其实它属性微软新开发的跨平台的简易IDE，微软近几年可能不红的，但是不得不说大厂的功底还是厚实，有颜值，有功能，速度快的，插件丰富，用惯了就离不开了

vscode界面

常规的我就不说了，先说说我比较常用的插件：

插件列表

• Chinese
  英文不好的同学，直接在下次这个语言包插件就可以了，已经翻译了大部分

• debugger for Chrome
  用于在编辑器中调试代码，需要自己起服务同时配置自己的服务端口号就可以了，不过我觉得还不如在chrome中直接调试比较好（安装后点击侧栏倒数第二个按钮就可以进入调试界面）

• Atom Material Theme
  这个则是编辑器的主题包，能修改文件图标与颜色等主题，我习惯了atom，这才迁移过来的

• Beautify
  个人比较喜欢的代码格式化插件，可以配置缩进多少格，快捷键为 ctrl + Alt + B，（原编辑器也有Alt + Shift + F 的格式化快捷键）

• Document This
  函数的长注释插件，快捷键为：Ctrl+Alt+D & Ctrl+Alt+D 能够自动填充参数：
  

  例子

• ESLint
  代码语法检查工具，大家在webpack或者gulp都会经常用到的，但这个插件有依赖需要全局安装eslint包 npm install -g eslint

• HTML Snippets
  HTML的代码补全插件，提高开发速度的好帮手

• JS JSX Snippets
  JS的代码块插件，比如输入clg 按 Tab 能够生成 console.log()

• Live Server
  起本地网路服务的插件，比起用Windows系统自带的网路服务工具建服务，无疑是方便很多的，只需要打开你想起服务的文件夹，然后按下右下角的Go Live
  

  服务按钮