ESLint不识别在Node.js 12中使用私有字段声明。

Question

即使我正在使用支持私有字段的NodeJS版本12，但Eslint不会识别在类声明中标记为#的私有字段。

我正在运行NodeJS v12.7.0。我已经搜索了所有DuckDuckGo和Google，并且我找不到一个Eslint插件或选项，可以告诉它接受私有字段符号(#)的标记。 我将emca设置为版本10。

class MyClass {
   #foo = 'bar';
   #bar = 'foo';

   constructor(foo, bar) {
      this.#foo = foo;
      this.#bar = bar;
   }
   ...
};

当我在上述代码上运行eslint时，我得到：

2:3 error Parsing error: Unexpected character '#'

我正在使用的项目不使用Babel，并且我不想必须包含它才能使私有字段生效。有没有什么办法可以使其正常工作而不必诉诸于使用Babel？

（当然，我没有任何反对Babel的意思，只是在这个特定的项目中我不想用它）。

- Doug Barbieri

Answer 1

2021 更新：你不再需要使用Babel！

你只需要将 eslint 更新到 v8.0.0 或更高版本。

请查看 eslint 发布说明：https://eslint.org/blog/2021/10/eslint-v8.0.0-released#highlights

请确保这些内容添加到你的.eslintrc文件或类似文件中：

{
    "parserOptions": {
        "ecmaVersion": 13
    }
}

您也可以直接使用latest而不是专门使用版本13。

- woofdinos

---

谢谢！我会尝试一下并告诉你。 - Doug Barbieri

Answer 2

这个被点赞的回答有点过时了，babel-eslint软件包已经改变了，而且你需要确保已配置Babel。在我的情况下，我是在服务器上操作的，所以不需要配置。

我在这里记录了解决方案：https://dev.to/griffadev/setting-up-eslint-to-work-with-new-or-proposed-javascript-features-such-as-private-class-fields-5fm7

TL;DR:

npm i eslint @babel/core @babel/eslint-parser @babel/preset-env -D

示例.eslintrc

{
    "env": {
        "browser": true,
        "es2021": true,
        "node": true
    },
    "extends": "eslint:recommended",
    "parser": "@babel/eslint-parser",
    "parserOptions": {
        "ecmaVersion": 12,
        "sourceType": "module"
    },
    "rules": {
    }
}

配置.babelrc

{
    "presets": [
      ["@babel/preset-env",
      {
        "shippedProposals": true
      }]
    ]
}

如果您正在使用Jest并且尚未配置.babelrc文件，则它将开始拾取此新文件，这可能会成为一个问题。您可以通过将.babelrc文件重命名为其他名称，并更新eslint配置文件来解决此问题。

"babelOptions": {
    "configFile": "./.babel-eslintrc"
 }

- George Griffiths

---

我按照你博客上的方法操作，遇到了一个问题并解决了它。在将"shippedProposals": true添加到.babelrc文件的部分，我复制并粘贴了对象，结果出现了错误： 0:0 error Parsing error: .presets[0][2] must be a string, or undefined我之所以会出现这个错误是因为我已经有一个对象在数组中，并且我将新的对象作为数组的第三个元素复制了进去。在这种情况下正确的做法是将"shippedProposals": true作为键值对添加到现有对象上。 - Russ Bain

Answer 3

我认为你可能需要硬着头皮使用 babel-eslint：https://github.com/babel/babel-eslint，这要求你安装 babel/core@>=7.2.0。

尽管私有类字段已经包含在node 12中，但根据规范（截至2019年8月），它仍是一个第3阶段的实验性功能。

npm install eslint babel-eslint --save-dev
# or
yarn add eslint babel-eslint -D

并添加

  "parser": "babel-eslint",

将内容添加到您的.eslintrc.js文件中

- Michał Czapliński

---

谢谢您的回复，Michal。我今天会尝试这个。 - Doug Barbieri

顺便说一句，那很有效！完美地接合了。非常感谢！ - Doug Barbieri

Answer 4

关于Visual Studio 2019，我发现@babel/eslint-parser与其不兼容，但旧版的babel-eslint可以使用。其他设置请参考@George的回答。

Visual Studio 2019版本为16.9.5。

- ctrlaltdavid

Answer 5

除非你真的非常想要那个特定的文件被检查，否则我建议避免添加新的依赖项来通过测试。在这种情况下，我的建议是添加

ignorePatterns: ["path/to/file(s).js"],

在您的.eslintrc.js文件中添加该文件以避免对特定文件进行linting。如果您真的想要lint它，请用__替换#，然后再将其改回来。我知道，这是一个hack，但它不会引入任何依赖项，而且它可以工作。

- jjmerelo