使用eslint-config-airbnb ESLint“模块构建失败”错误

Question

我正在尝试设置一个React项目，该项目使用webpack和ESLint以及用于ESLint的airbnb配置。 当我尝试使用webpack dev服务器启动项目时，出现以下错误：

“模块构建失败：错误：/react-template/node_modules/eslint-config-airbnb/rules/react-a11y.js：ESLint配置无效： - 意外的顶级属性”ecmaFeatures“。”

这是使用eslint-config-airbnb v.15.0.1。 我检查了react-a11y.js文件并确认有一个“ecmaFeatures”的顶级属性。 我知道从ESLint 2.0.0开始，ecmaFeatures现在应该在parserOptions属性下，但我不确定它是否只适用于.eslintrc文件。 如果可能，我想使用airbnb配置，所以我感谢任何帮助。 这是我的.eslintrc文件供参考。

.eslintrc

{
  "parser": "babel-eslint",
  "parserOptions": {
    "ecmaVersion": 2016,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "env": {
    "es6": true,
    "browser": true,
    "node": true,
    "jest": true
  },
  "extends": ["airbnb"]
}

Answer 1

我想出了一个解决方案。

你必须编辑react-a11y.js和react.js位于./node_modules/.bin/eslint-config-airbnb/rules/ 。

在react-a11y.js删除：

ecmaFeatures: {
  jsx: true
},

并替换为：

parserOptions: {
  ecmaFeatures: {
    jsx: true,
  },
},

在react.js删除：

ecmaFeatures: {
  jsx: true
},

你应该好好去。

此外，我现在正在看airbnb的回购，看起来他们差不多一个月前修复了它，但我今天刚重新安装了eslint-config-airbnb，所以我不确定那里发生了什么。

这里是react-a11y.js diff和react.js diff的链接 。 它们准确显示了您需要添加/删除的内容。

Answer 2

当问题出现时，全局eslint已从3.19.0-1升级到4.0.0-1。

eslint eslint-config-airbnb和eslint-config-airbnb-base尚不支持eslint v4

https://github.com/eslint/eslint/issues/8726#issuecomment-308367541

Answer 3

你JSON无效。 在第一个“解析器”周围缺少引号;

{
  "parser": "babel-eslint",
  "parserOptions": {
  "ecmaVersion": 2016,
  "sourceType": "module",
   "ecmaFeatures": {
  "jsx": true
 }
},
  "env": {
  "es6": true,
  "browser": true,
  "node": true,
  "jest": true
 },
 "extends": ["airbnb"]
}