1. 首先安装vue插件,安装方法:

  setting  -->  plugin  ,点击plugin,在内容部分的左侧输入框输入vue,会出现两个关于vue的插件,点击安装即可。安装完成后,就可以看到,新建文件时,会有vue文件的提示。

  如下图所示:

  

2. 设置vue新建文件模板。

  步骤: settings  -->  file and code templates .在内容区域左侧点击vue file,修改对应的模板内容即可。

  如下图所示:

3. 设置vue文件支持的编码格式(例如:支持的缩进是2):

  步骤:settings --> code style,把code style 下面所有你认识、觉得会用到的内容都设置成               2,当然也包括other file types,也是设置vue格式最关键的一步。

  如下图所示:

  

4. vue 使用的是es6语法, 所以要将JavaScript的版本改成es6

  步骤:settings --> languages& frameworks -- > javascript ,选择javascript,修改内容区域的javascript language version: ECMAScript 6 即可。

  

5. 如果你在修改vue文件,ctrl+s 之后,dev不自动编译,请参考http://www.cnblogs.com/ssrsblogs/p/6155747.html

设置 webstorm 对 .vue 高亮的更多相关文章

  1. WebStorm配置Vue开发环境

    虽然最新版的前端开发利器WebStorm支持了Vue,但是大部分人的WebStorm依然是默认不支持Vue的老版本(比如之前的我),所以需要手动添加WebStorm对Vue的支持.要想让WebStor ...

  2. vue中npm run dev运行项目不能自动打开浏览器! 以及 webstorm跑vue项目jshint一直提示错误问题的解决方法!

    vue中npm run dev运行项目不能自动打开浏览器!以及 webstorm跑vue项目jshint一直提示错误问题的解决方法! 1.上个项目结束就很久没有使用vue了,最近打算用vue搭建自己的 ...

  3. sublime Text3支持vue高亮,sublime Text3格式化Vue

    第一:让sublime Text3支持Vue高亮 PS:我的sublime版本是3126,我不清楚其它版本的是不是这样设置,不过可以看看思路自己摸索下 1.下载可以让vue格式高亮的插件vue-syn ...

  4. vs 2012 设置选中的引用高亮 颜色

    一个简单的小技巧,不用插件也可以做到,vs 2012 设置选中的引用高亮 颜色 .vs 默认的单击引用的变量时,显示的颜色是灰色,基本看不出来,所有特意抽空捣鼓了下 还真让我给找出来 工具==> ...

  5. atom中vue高亮支持emmet语法

    vue高亮插件: language-vue 支持emmet语法: 文件>用户键盘映射>keymap.cson添加: 'atom-text-editor[data-grammar~=&quo ...

  6. 彻底解决eslint与webstorm针对vue的script标签缩进处理方式冲突问题

    彻底解决eslint与webstorm针对vue的script标签缩进处理方式冲突问题 2018年12月08日 21:58:26 Kevin395 阅读数 1753   背景不多介绍了,直接上代码. ...

  7. webstorm vue高亮

    文件->设置->文件类型 第一步 第二步选择html 添加*.vue 搞定

  8. 关于webstorm 对 vue的设置

    1. 首先安装vue插件,安装方法: setting  -->  plugin  ,点击plugin,在内容部分的左侧输入框输入vue,会出现两个关于vue的插件,点击安装即可.安装完成后,就可 ...

  9. Webstorm新建vue类型文件设置

    今天安装了Node.js,配置了vue需要的框架,发现原有的wenstorm新建文件的时候没有vue文件选项,因此,学习了一下webstorm如何配置创建vue文件 具体过程如下: 第一步,打开web ...

随机推荐

  1. 个人博客作业-Week2 (代码规范, 代码复审)

    代码规范: 1.这些规范都是官僚制度下产生的浪费大家的编程时间.影响人们开发效率, 浪费时间的东西. 编码规范它包含了代码格式,还包括了编码风格和其他规范,通常涉及:缩进.空格使用.Tab使用 注释. ...

  2. 猫咪记单词Beta版使用说明

    猫咪记单词Beta版使用说明 一.项目背景 英语四级考试.六级考试.托福.雅思等英语方面的考试是现在大学生必须面对的问题.同时因为学生对手机的使用越来越频繁,而且仅仅通过书本背诵单词又比较无聊坚持的时 ...

  3. GuiHelloWorld

    package com.home.test; import java.awt.Color; import java.awt.Cursor; import java.awt.Font; import j ...

  4. 第二个spring,第三天

    陈志棚:成绩的统筹 李天麟:界面音乐 徐侃:代码算法 给位组员继续的完成分配任务.

  5. Ajax的注意事项

    case 1: 无论是使用原生的JavaScript,还是JQuery,通过Ajax请求后端程序数据,返回的数据默认是字符串,字符串,字符串,重要的事情说三遍!!! case 2: 不要尝试直接将返回 ...

  6. mysql 和php 保留2位小数

    一般交易中保留的数字的小数位数为2位(即最小单位为 1分钱[0.01元]) 数据库设计中预金钱有关或要求精准度要高的用 decimal(n,m) 表示,n表示保留的数字长度,保留的小数位数,如deci ...

  7. 如何使用grep 等命令快速的在日志中找到自己需要的内容

    虽然使用linux也有好几年了,但是服务器端开发的活儿正经来算才干不到一年. 一直没有需求和机会会去花大量的时间排查日志啥的,直到我摊上了大事t t,写的代码在线上出了bug需要排查问题. grep可 ...

  8. selenium之封装登陆操作

    # selenium 封装登录操作举例 import os, time # from selenium import webdriver class LoginPage(): '''登录模块''' d ...

  9. input 的 oninput onkeypress onkeydown onchange 事件的区别

    事件执行顺序: <input type="text" id="foo" onkeydown="console.log('down')" ...

  10. Linux学习之/etc/init.d/目录和rc.local脚本

    init.d目录中包含很多系统服务的启动和停止脚本,比较常用的就是网络服务,当你修改了网络配置时,可以自行 sudo /etc/init.d/networking restart  命令来重启网络服务 ...