Eslint 不允許 static class 屬性

Question

我目前正在節點 12.14.1 上開發 API 並使用 Eslint 幫助我編寫代碼。 不幸的是，它不允許我設置static class 屬性，如下所示：

class AuthManager {
  static PROP = 'value'
}

給出以下錯誤： Parsing error: Unexpected token =eslint

JS 和 Node.js 已經支持 Static class 屬性。
如何禁用此規則？

我還有以下.eslintrc.json文件：

{
  "env": {
      "es6": true,
      "node": true
  },
  "extends": "eslint:recommended",
  "globals": {
      "Atomics": "readonly",
      "SharedArrayBuffer": "readonly"
  },
  "parserOptions": {
      "ecmaVersion": 2018,
      "sourceType": "module"
  }
}

Answer 1

ESLint 及其默認解析器目前不支持類字段語法。 您可以通過將配置的解析器更改為babel-eslint來解決問題。

npm install --save-dev babel-eslint

// eslintrc.json
{
  "parser": "babel-eslint",
  ...
}

Eslint 的默認解析器 Espree 不支持類字段，因為該語法當前處於第 3 階段，並且決定在 Espree 中僅支持第 4 階段的提案。

Answer 2

ESLint v8 現在原生支持靜態類屬性： https ://eslint.org/blog/2021/10/eslint-v8.0.0-released

parserOptions ecmaVersion 應設置為 13、2022 或“最新”以啟用支持。

Answer 3

你需要安裝@babel/eslint-parser ：

yarn add --dev @babel/eslint-parser

並在您的.eslintrc.yml中使用解析器，例如：

parser: "@babel/eslint-parser"

Answer 4

截至目前，我不得不使用這些配置

.eslintrc.js

module.exports = {
  env: {
    node: true,
    es6: true,
  },
  extends: [
    'airbnb-base',
  ],
  parser: '@babel/eslint-parser',
  parserOptions: {
    babelOptions: {
      configFile: './.babelrc',
    },
    ecmaVersion: 2018, // needed to support spread in objects
  },
  plugins: ['@babel'],
};

.babelrc

{
  "presets": ["@babel/env"],
  "plugins": [
    "@babel/plugin-syntax-class-properties"
  ]
}

我必須安裝：

npm i -D @babel/preset-env
npm i -D @babel/eslint-parser
npm i -D @babel/eslint-plugin
npm i -D @babel/plugin-syntax-class-properties

請注意，上面的@babel模塊是我的package.json中唯一的@babel模塊。