ESLint解析错误:意外的令牌

下面的代码:

import React from 'react';
import { Link } from 'react-router';
import { View, NavBar } from 'amazeui-touch';


import * as Pages from '../components';


const {  Home, ...Components } = Pages;

我得到这个eslint错误:

7:16  error  Parsing error: Unexpected token .. Why?

这是我的eslint配置:

{
"extends": "airbnb",
"rules": {
/* JSX */
"react/prop-types": [1, {
"ignore": ["className", "children", "location", "params", "location*"]
}],
"no-param-reassign": [0, {
"props": false
}],
"prefer-rest-params": 1,
"arrow-body-style": 0,
"prefer-template": 0,
"react/prefer-stateless-function": 1,
"react/jsx-no-bind": [0, {
"ignoreRefs": false,
"allowArrowFunctions": false,
"allowBind": true
}],
}
}
< p >… ．... 有什么问题吗?< / p >
498505 次浏览
小开

ESLint 2。x实验性地支持ObjectRestSpread语法，你可以通过在你的.eslintrc中添加以下内容来启用它

"parserOptions": {
"ecmaVersion": 6,
"ecmaFeatures": {
"experimentalObjectRestSpread": true
}
},

ESLint 1。x本身不支持展开运算符，解决这个问题的一种方法是使用babel-eslint解析器。最新的安装和使用说明在项目自述中。

小开

由于您的开发环境和ESLint当前的解析能力与正在进行的JavaScripts ES6~7的变化不兼容，在ESLint解析中出现意外的令牌错误。

添加“parseroptions”;属性对于特定情况不再足够，例如使用。eslintrc

static contextTypes = { ... } /* react */

在ES6类中，因为ESLint目前无法自己解析它。这种特殊的情况会抛出一个错误:

error Parsing error: Unexpected token =

解决方案是让ESLint通过兼容的解析器来解析，即@babel/ ESLint -parser或babel- ESLint用于v7以下的babel版本。

添加:

"parser": "@babel/eslint-parser"

到你的.eslintrc文件并运行npm install @babel/eslint-parser --save-dev或yarn add -D @babel/eslint-parser。

请注意，从React ^16.3开始的新的上下文API有一些重要的变化，请参阅官方指南。

小开

"parser": "babel-eslint"帮助我解决了这个问题

{
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true,
"modules": true,
"experimentalObjectRestSpread": true
}
},
"plugins": [
"react"
],
"extends": ["eslint:recommended", "plugin:react/recommended"],
"rules": {
"comma-dangle": 0,
"react/jsx-uses-vars": 1,
"react/display-name": 1,
"no-unused-vars": "warn",
"no-console": 1,
"no-unexpected-multiline": "warn"
},
"settings": {
"react": {
"pragma": "React",
"version": "15.6.1"
}
}
}

Reference .

小开
我解决了这个问题 首先，使用npm

安装babel-eslint 
npm install babel-eslint --save-dev

其次，在.eslintrc文件中添加此配置

{
"parser":"babel-eslint"
}
小开

在我的情况下(我使用Firebase云函数)，我打开.eslintrc.json并更改:

"parserOptions": {
// Required for certain syntax usages
"ecmaVersion": 2017
},

:

"parserOptions": {
// Required for certain syntax usages
"ecmaVersion": 2020
},
小开

如果你有一个预提交任务，哈士奇运行eslint，请继续阅读。我尝试了大部分关于parserOptions和parser值的答案，其中我的实际问题是关于我正在使用的节点版本。

我当前的节点版本是12.0.0，但husky以某种方式使用了我的nvm默认版本(尽管我的系统中没有nvm)。这似乎是一个哈士奇问题本身。所以:

  1. 我删除$HOME/.nvm文件夹，当我之前删除nvm时没有删除。
  2. 验证节点是最新的，并做了适当的解析器选项。
  3. 它开始工作了!
小开

只是为了记录，如果你正在使用eslint-plugin-vue，添加'parser': 'babel-eslint'的正确位置是在parserOptions参数内。

  'parserOptions': {
'parser': 'babel-eslint',
'ecmaVersion': 2018,
'sourceType': 'module'
}

https://eslint.vuejs.org/user-guide/#faq

小开

最初，解决方案是提供以下配置，因为对象解构曾经是一个实验特性，默认情况下不支持:

{
"parserOptions": {
"ecmaFeatures": {
"experimentalObjectRestSpread": true
}
}
}

从版本5开始，这个选项已弃用。

现在只要声明一个ES的新版本就足够了:

{
"parserOptions": {
"ecmaVersion": 2018
}
}
小开

在2021年2月，你可以使用这些值

ecmaVersion -设置为3,5(默认)，6,7,8,9,10,11或12，以指定您想使用的ECMAScript语法版本。也可以设置为2015(与6相同)、2016(与7相同)、2017(与8相同)、2018(与9相同)、2019(与10相同)、2020(与11相同)或2021(与12相同)。

https://eslint.org/docs/user-guide/configuring/language-options#specifying-parser-options

小开

我使用typescript，我解决了这个错误改变parser

....
"prettier/prettier": [
"error",
{
.....
"parser": "typescript",
.....
}
],
....
小开

尽管实现了上述所有解决方案，但我还是遇到了这个问题。当我降级eslint版本时，它开始工作了

小开

我通过在.eslintrc.json文件中设置来解决这个问题:

"extends": [
...,
"plugin:prettier/recommended"
]
小开

我使用eslint用于云函数(开发环境:flutter 2.2.3)。

在我的情况下，.eslintrc.json不存在，所以我必须更新.eslintrc.js文件，在文件末尾包含parserOptions: { "ecmaVersion": 2020, },属性。我更新后的.eslintrc.js文件如下所示:

module.exports = {
root: true,
env: {
es6: true,
node: true,
},
extends: [
"eslint:recommended",
"google",
],
rules: {
quotes: ["error", "double"],
},
  

// Newly added property
parserOptions: {
"ecmaVersion": 2020,
},
};
小开

对于React + Firebase函数

去:函数->.eslintrc.js

添加- parserOptions: { ecmaVersion: 8 }, < / p > 

module.exports = {
root: true,
env: {
es6: true,
node: true,
},
parserOptions: {
ecmaVersion: 8,
},
extends: ["eslint:recommended", "google"],
rules: {
quotes: ["error", "double"],
},
};
小开 
.
.
{
"parserOptions": {
"ecmaVersion": 2020
},
.
.

会成功的。

小开

我必须将ecmaVersion更新为"latest"

"parserOptions": {
"parser": "@babel/eslint-parser",
"sourceType": "module",
"ecmaVersion": "latest",
"ecmaFeatures": {
"jsx": true,
"experimentalObjectRestSpread": true
},
"requireConfigFile": false
},

提交答案