Question

使用此代码：

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
    }],
  }
}

.... .... 有什么问题？

Answer 1

ESLint解析中出现意外的令牌错误是由于您的开发环境与ESLint当前的解析功能之间的不兼容以及JavaScripts ES6~7的持续更改。

添加＆＃34; parserOptions＆＃34;对于特定情况，例如使用

，对.eslintrc的属性已不再适用

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

在ES6类中，因为ESLint目前无法自行解析它。这种特殊情况会引发错误：

error Parsing error: Unexpected token =

解决方案是让兼容的解析器解析ESLint。 babel-eslint是一个在阅读本页后最近救了我的软件包，我决定将其作为替代方案的替代方案。

只需添加：

"parser": "babel-eslint"

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

请注意，从React ^16.3开始的新上下文API 有一些重要更改，请参阅official guide。

Answer 2

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

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

ESLint 1.x本身不支持扩展运算符，解决此问题的一种方法是使用babel-eslint parser。最新的安装和使用说明在项目自述文件中。

Answer 3

"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

Answer 4

最初，解决方案是提供以下配置作为对象分解，这曾经是实验性功能，默认情况下不受支持：

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

从版本5开始，此option has been deprecated。

现在仅声明一个ES版本就足够了，它已经足够新了：

{
  "parserOptions": {
    "ecmaVersion": 2018
  }
}

Answer 5

在我的情况下（即使用Firebase Cloud Functions），我打开了BigDecimal并进行了更改：

.eslintrc.json

收件人：

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

Answer 6

仅作记录，如果您使用的是 eslint-plugin-vue ，则正确添加'parser': 'babel-eslint'的位置是在parserOptions参数内。

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

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

Answer 7

在 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

Answer 8

我通过以下方式解决了这个问题首先，使用npm安装babel-eslint

npm install babel-eslint --save-dev

第二，将此配置添加到.eslintrc文件

{
   "parser":"babel-eslint"
}

Answer 9

如果您在沙哑运行eslint的情况下执行了预提交任务，请继续阅读。我尝试了有关parserOptions和parser值的大多数答案，而我的实际问题是有关所使用的节点版本的。

我当前的节点版本是12.0.0，但是赫斯基以某种方式使用了我的nvm默认版本（即使我的系统中没有nvm）。这似乎是issue with husky本身。所以：

我删除了$HOME/.nvm文件夹，该文件夹在我早些时候删除nvm时并未删除。
已验证节点是最新的，并且具有正确的解析器选项。
开始工作了！

Answer 10

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

Answer 11

<块引用>

我正在使用打字稿并解决了此错误更改 parser

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

ESLint解析错误：意外的令牌

11 个答案:

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