Eslint 不允许静态 class 属性

Question

我目前正在 Node 12.14.1 上开发 API 并使用 Eslint 帮助我编写代码。不幸的是，它不允许我设置 static class properties，如下所示：

class AuthManager {
  static PROP = 'value'
}

报错如下：Parsing error: Unexpected token =eslint

JS 和 Node 已经支持静态 class 属性。
如何禁用此规则？

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

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

Answer 1

ESLint 及其默认解析器目前不支持 class 字段语法。您可以通过将配置的解析器更改为 babel-eslint.

来解决问题

npm install --save-dev babel-eslint

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

Eslint 的默认解析器 Espree 不支持 class 字段，因为该语法目前处于第 3 阶段，并且决定在 Espree 中仅支持第 4 阶段的提案。

Answer 2

您需要安装@babel/eslint-parser:

yarn add --dev @babel/eslint-parser

并在您的 .eslintrc.yml 中加入解析器，例如：

parser: "@babel/eslint-parser"

Answer 3

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

.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 模块

Answer 4

ESLint v8 现在原生支持静态 class 属性：https://eslint.org/blog/2021/10/eslint-v8.0.0-released

parserOptions ecmaVersion 应设置为 13、2022 或“最新”以启用支持。

Eslint 不允许静态 class 属性

Eslint does not allow static class properties

javascript

node.js

eslint

class-fields