vue.js之路(2)——为WebStrom添加vue的相关支持
WebStrom作为老牌的前端开发利器,它的插件功能也是非常全面和强大的。虽然webStrom自身不会识别*.vue的文件,但是可以通过一系列设置和插件解决这些问题。废话不多说,这里说一下我的设置流程(本喵用的是windows系统,WebStrom版本是2016.3.2)1.添加ES6语法支持:因为vue是基于ES6语法的,所以必须要保证IDE能够支持ES6。首先打开设置: win
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即可。
那么,到这里就算大功告成啦,之后使用起来应该就非常方便了。
楼上又开始装修了,电钻什么的。。。我要避难去啦~~
更多推荐
所有评论(0)