Webstorm 添加 .vue 文件功能并支持高亮和ES6语法

一、Webstorm添加.vue文件功能

首先,点击左上角“File”找到“settings”进入到设置窗口界面,点击“Plugins”右侧搜索 vue:
Webstorm 添加 .vue 文件功能并支持高亮和ES6语法

然后,点击“Browse..”进入到下载页面,选择“Vue.js” 点击“Install plugin”进行下载:

Webstorm 添加 .vue 文件功能并支持高亮和ES6语法

下载完成后点击右下角“Apply”进行重启操作:

Webstorm 添加 .vue 文件功能并支持高亮和ES6语法

再次进入到“settings”界面,点击“Editor”展开,点击“File and Code Templates”,再点击右侧绿色加号,然后在“Name”和“Extension”填入如图操作,最后确认即可:

Webstorm 添加 .vue 文件功能并支持高亮和ES6语法

需要高亮的朋友可以看下图设置:
Webstorm 添加 .vue 文件功能并支持高亮和ES6语法

二、Webstorm支持es6语法

这个设置也很简单,不多说,上图很好理解:
Webstorm 添加 .vue 文件功能并支持高亮和ES6语法