webstorn中的vue文件识别es6代码

1.webstorm中es6语法报错,解决方法:

打开 Settings => Languages & Frameworks => Javascript
把 Javascript Language version 改为 ECMAScript 6

这样做所有的.js文件中es6不再报错,但是.vue文件中es6语法依然报错。

2.  .vue文件中es6语法报错

(1)打开 Settings => File Types 找到 HTML 添加 *.vue

这样vue文件就相当于html文件,可以编辑css,js,也都有智能提示。但是,在.vue文件中es6语法还是报错。

(2).粗暴:直接在<script>标签中添加type="text/ecmascript-6",.vue里面的代码会高亮并支持ES6。

(3).将script标签添加 type=”es6” 属性

<script type="es6">
</script>

然后打开 Settings => Language Injections 添加 XML Tag Injection,内容如下图。

3.补充新功能:右键新建时出现.vue文件类型,就像新建html文件一样,方法:

Setting-Editor-File and Code Templates 点击右上角的加号 添加vue文件 Name为vue File, Extension 为vue,下面的位置可以填写自定义的初始化模板内容。

点击OK 返回,在项目中新建会出现vue文件 webstorm配置新建vue文件完成。

原文地址:http://www.cnblogs.com/chenguangliang/p/6433462.html

webstorn中的vue文件识别es6代码的更多相关文章

  1. 在webstrorm中配置好es6 babel【更新:在webstorm中配置.vue和.vue文件中支持es6】

    第一步:全局安装babel-cli npm install -g babel-cli 第二步,新建一个空项目,在 WebStorm 中的当前项目中打开 Terminal,进入项目的根目录下, 安装 E ...

  2. Vue.js源码中大量采用的ES6新特性介绍:模块、let、const

    1 关于ES6      ECMAScript6(以下简称ES6)是JavaScript语言的最新一代标准,发布于2015年6月,因为ECMA委员会决定从ES6起每年更新一次标准,因此ES6被改名为E ...

  3. 在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示

    在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示) 1.使用npm安装依赖 npm install --save codemirror; 2.在页面中放入如下代码 ...

  4. Sumblime Text3中使用vue-cli创建vue项目,代码不高亮,解决

    问题如下:在Sumblime Text3中打开vue-cli常见的项目,代码一片灰色 解决如下: 第一步:下载文件Vue components  链接 GitHub - vuejs/vue-synta ...

  5. 如何在webpack开发中利用vue框架使用ES6中提供的新语法

    在webpack中开发,会遇到一大推问题,特别是babel6升级到babel7,要跟新一大推插件,而对于安装babel的功能就是在webpack开发中,vue中能够是用ES6的新特性: 例如ES6中的 ...

  6. atom中开发vue常用插件

    atom: 开发利器,界面友好,配色出色,好用的插件众多. language-vue: 这个是首推,因为它就是为vue而生的呀,支持很多vue里的提示.在空的vue页面敲tem,vue模板的提示就自动 ...

  7. Vue+WebSocket+ES6+Canvas 制作「你画我猜」小游戏

    Vue+WebSocket+ES6+Canvas 制作「你画我猜」小游戏 转载 来源:jrainlau 链接:https://segmentfault.com/a/1190000005804860 项 ...

  8. 011 webpack中使用vue

    一:在webpack中使用vue 1.安装vue的包 2.index.html <!DOCTYPE html> <html lang="en"> <h ...

  9. render方法渲染组件和在webpack中导入vue

    使用component注册的组件div容器里可以放多个,但是使用render的只能放一个 <div id="app"> <p>我可以放两个</p> ...

随机推荐

  1. python list常见用法

    来至builtins.py: def extend(self, iterable): # real signature unknown; restored from __doc__ "&qu ...

  2. (转)shell--read命令的选项及用法

    shell--read命令 原文:https://www.cnblogs.com/lottu/p/3962921.html http://blog.csdn.net/skdkjzz/article/d ...

  3. python读取excel表格生成sql语句 第一版

    由于单位设计数据库表·,都用sql.不知道什么原因不用 powerdesign或者ermaster工具,建表很痛苦  作为程序猿当然要想办法解决,用Python写一个程序解决 需要用到 xlrd li ...

  4. VS中为什么不同的项目类型属性查看和设置的界面不一样

    在VS中,存在ATL.MFC.Win32.CLR.常规等等各种工程模板,这些工程模板对应于开发不同类型的应用,比如要开发com,你应该选ATL:开发最原始的通过API代用操作系统的应用,应该用Win3 ...

  5. [转]批处理for命令使用指南

    摘要:本文由浅入深,为大家专门讲解for的用法,希望大家喜欢. 首先应该明确的是,for不是一个简单的命令,它的用法比较复杂,它还可以带四个参数(/L /D /R /F),其中:/L和/F参数是最经常 ...

  6. [转]ASP.NET Core 中文文档 第四章 MVC(4.3)过滤器

    本文转自:http://www.cnblogs.com/dotNETCoreSG/p/aspnetcore-4_4_3-filters.html 原文:Filters 作者:Steve Smith 翻 ...

  7. [转]使用 Razor 进行递归操作

    本文转自:http://www.cnblogs.com/zbw911/archive/2013/01/10/2855025.html 做一个菜单,多级的会遇到递归的问题,打算在code中做一个递归方法 ...

  8. c#-foreach的秘密

    foreach的秘密 class Program { static void Main(string[] args) { //创建Person的对象 Person p1=new Person(); / ...

  9. 在 Visual Studio 中调试 XAML 设计时异常

    在 Visual Studio 中进行 WPF, UWP, Silverlight 开发时,经常会遇到 XAML 设计器由于遭遇异常而无法正常显示设计器视图的情况.很多时候由于最终生成的项目在运行时并 ...

  10. asp 2.0 ajax triggers 触发更新