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'
  }

大功告成了~

总结

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