WebStorm配置Vue开发环境

  虽然最新版的前端开发利器WebStorm支持了Vue,但是大部分人的WebStorm依然是默认不支持Vue的老版本(比如之前的我),所以需要手动添加WebStorm对Vue的支持。要想让WebStorm支持Vue主要分两步,第一步是安装Vue.js插件,使得WebStorm能够对Vue语法进行提示;第二步是配置Vue模板,即快速创建Vue文件。

  1.安装Vue.js插件

  点击Preferences进入WebStorm的配置页面,然后点击Plugins设置插件。

  点击Browse Repositories按钮(第二个)浏览插件仓库,搜索Vue.js插件进行安装,安装完成后如下图所示。

  WebStorm配置Vue开发环境_第1张图片

 

  2.配置Vue模板

  点击Preferences进入WebStorm的配置页面,按下图层级进入File and Code Templates,即文件模板配置。

  WebStorm配置Vue开发环境_第2张图片

  

  然后点击添加模板的按钮(绿色加号按钮),输入模板名Vue,Extension(即拓展名)设为vue(意为创建出来的文件是 *.vue),输入Vue标准模板,即:





  当然,按照最新WebStorm对Vue模板的设置,可以写为:





  点击Apply或OK即可保存模板,下一次创建Vue文件时,不需要新建file,而可以直接新建Vue文件。

  经过以上两步,接下来的开发可以直接使用WebStorm开发Vue。

转载于:https://www.cnblogs.com/karthuslorin/p/8301282.html

你可能感兴趣的:(javascript,前端)