vue.js之路(2)——为WebStrom添加vue的相关支持

WebStrom作为老牌的前端开发利器，它的插件功能也是非常全面和强大的。虽然webStrom自身不会识别*.vue的文件，但是可以通过一系列设置和插件解决这些问题。

废话不多说，这里说一下我的设置流程（本喵用的是windows系统，WebStrom版本是2016.3.2）

1.添加ES6语法支持：

因为vue是基于ES6语法的，所以必须要保证IDE能够支持ES6。

首先打开设置： window快捷键是ctrl+alt+s，当然，这个有可能和你QQ的热键冲突了，你可以在菜单的file中找到settings。而mac下的快捷键如果我没记错，应该是command+逗号。

可以通过搜索功能找到Language&Frameworks，再找到下边的JavaScript，设置如下：

并且在下边的Libraries中，确认勾中了es6的选项：

这样，对于ES6的支持问题就搞定了。

2.让WebStrom可以识别Vue文件：

一开始我们会发现，我们搭建好的vue工程，凡事以vue为后缀的文件，代码都不会高亮变色等等。

这里我们依然在设置界面中，找到File Types，接着选中上边窗口的HTML，在下边的窗口中点击绿色加号，然后输入*.vue，添加即可，如下图：

这样vue文件，就可以被识别了。

3.安装vue相关插件

WebStrom中有两个vue相关的插件，建议都安装上，安装以后会发现，我们在新建文件的时候，会多出vue类型的文件，并且会自动生成一套模板，非常方便。

在setting中找到Plugins,然后搜索vue，然后分别安装这两个插件，再重启WebStrom即可。

那么，到这里就算大功告成啦，之后使用起来应该就非常方便了。

楼上又开始装修了，电钻什么的。。。我要避难去啦~~