使用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"]
}