vscode eslint插件报错Parsing error: Invalid ecmaVersion问题

 更新时间:2023年10月20日 15:26:49   作者:HHHHy2019  
这篇文章主要介绍了vscode eslint插件报错Parsing error: Invalid ecmaVersion问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

vscode eslint插件报错Parsing error: Invalid ecmaVersion

问题描述

vscode 打开项目每个页面都会首行第一个单词带有红色波浪线~,显示为Parsing error: Invalid ecmaVersion.

解决方式(网络)

安装最新版eslint

npm i -g eslint

vscode中eslint语法报错问题

我们使用vue-cli创建项目,默认会启用eslint语法检验,虽然是个好东西,可以让我们的代码格式非常的规范,但是他过于严格的语法规范,比如不能加分号,使用单引号,代码结尾还有有一个空行等等过于严格的要求,让代码经常报错,与修改一个空格,一个分号的事就大大降低了开发效率,所以需要解除一些工具帮我们自动按照esllint进行代码自动规范化。

解决

我是使用了三个插件来实现保存自动进行代码规范化的功能,非常的方便。

步骤:

1)首先确保自己的vscode中安装了eslint、vetur、prettier这三个插件

2)在配置文件(setting.json)中进行配置

按ctrl+shift+p打开搜索setting,打开配置文件

在配置文件中添加如下配置

// 在保存的时候进行格式化
  "editor.formatOnSave": true,

3)在项目根目录下新建.prettierrc配置文件,对prettier进行设置,配置如下:

因为prettier有个很恶心的功能,就是会将所有的单引号变为双引号,所有语句加上分号,这个明显不符合eslint的语法,所以需要我们进行配置

{
	//使用单引号
  "singleQuote": true,
  //不添加分号
  "semi": false
}

4)然而这样配置完还是会报错,eslint要求我们在function和()之间加上一个空格,但是这样并不好看,所以我们可以在.eslintrc.js文件中进行配置,禁用该规则,配置如下:

 rules: {
    // 禁用方法()前有一个空格
    'space-before-function-paren': 0,
    //关闭定义未使用的错误
   "no-unused-vars": "off"
   //关闭缩进检测
	'indent': 'off'
  }

大功告成了~

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • TCP协议详解_动力节点Java学院整理

    TCP协议详解_动力节点Java学院整理

    本文描述了TCP协议,首先简单介绍了TCP完成了一些什么功能;介绍了TCP报文格式,以及典型报文的数据格式。现在通过本文给大家详细介绍,感兴趣的的朋友一起看看吧
    2017-07-07
  • 老生常谈计算机中的编码问题(必看篇)

    老生常谈计算机中的编码问题(必看篇)

    下面小编就为大家带来一篇老生常谈计算机中的编码问题(必看篇)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • 文本文件编码方式区别

    文本文件编码方式区别

    当一个软件打开一个文本时,它要做的第一件事是决定这个文本究竟是使用哪种字符集的哪种编码保存的。
    2008-09-09
  • conda常用命令整理及用法详解

    conda常用命令整理及用法详解

    这篇文章主要为大家介绍了conda常用命令整理及用法详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-01-01
  • HTTP长连接与短连接使用方法及测试详解

    HTTP长连接与短连接使用方法及测试详解

    这篇文章主要介绍了HTTP长连接与短连接使用方法及测试,需要的朋友可以参考下
    2020-02-02
  • 微信小程序学习之初探小程序

    微信小程序学习之初探小程序

    这两天“微信小程序”这个词占据了朋友圈,大有一番风起云涌之势,当然,还不可能夸张到使原生App开发人员失业这种程度。当然,作为一名技术人员,时刻保持对新技术的好奇心是必须的,所以在网上找大神的教程,搭建了一下开发环境,来学习一下这个新的开发框架。
    2016-09-09
  • 手把手教你用Hexo+Github搭建属于自己的博客(详细图文)

    手把手教你用Hexo+Github搭建属于自己的博客(详细图文)

    越来越多的朋友选择自己架设自己的博客,以来方便个性样式二来也能带来不少收入,大部分朋友都会选择wordpress搭建个人博客,这里为大家分享使用Hexo+Github搭建开发者博客的方法,需要的朋友可以参考下
    2017-10-10
  • 怎样写好commit message提高业务效率

    怎样写好commit message提高业务效率

    这篇文章主要为大家介绍了如何写好commit message帮助业务团队提高效率方法详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-05-05
  • git分支的创建、切换、合并及删除操作小结

    git分支的创建、切换、合并及删除操作小结

    这篇文章给大家详细的介绍了关于git分支的操作,其中包括查看现存分支、创建分支、切换分支、提交分支、分支合并以及删除分支,文中给出了详细示例代码,相信对大家的学习和理解很有帮助,有需要的朋友们下面来一起学习学习吧。
    2016-11-11
  • Git上新建的分支IDEA找不到问题及解决

    Git上新建的分支IDEA找不到问题及解决

    文章介绍了如何在IntelliJ IDEA中使用Git进行代码拉取(pull)操作,包括通过点击刷新按钮和在终端中执行命令两种方法,同时,还提供了解决项目未更新问题的步骤
    2024-11-11

最新评论