ESLint: 'chrome' 未定义 (no-undef)

Question

我将 ESLint 添加到我的 chrome 扩展项目中。 我正在使用以 chrome 开头的 chrome API chrome. ，但显然 eslint 指出它是错误的。

我想它应该是这样的：

"env": {
  "browser": true,
  "chrome": true,
  "es6": true
},

但显然不是。

UPD：我认为最好的答案是添加webextensions: true – 正如 wOxxOm 建议的那样。 因为它是一个 chrome 扩展 - chrome. API在这里被大量使用。

否则按照其他建议添加/* global chrome */会更好。

感谢您的回答。

Answer 1

您需要添加：

"env": {
    // ...
    "webextensions": true
}

到您的.eslintrc.json文件或一般的 eslint 配置。

Answer 2

您可以在 eslint 配置文件中添加它以添加全局变量

"globals": {
    "chrome": true
}

Answer 3

编辑：在create-react-app v4.0.0 ，不再需要EXTEND_ESLINT标志来自定义 ESLint 配置，因此在 4.0.0 版本之后不需要以下答案。

我们还将eslint-plugin-hooks升级到 4.0.0 版并删除了EXTEND_ESLINT标志，因为它不再需要自定义 ESLint 配置。

---

我正在使用create-react-app并发现除了定义：

# This is YAML btw
env:
  # ...
  webextensions: true

在我的eslint配置（将chrome添加为全局）中，我还必须将create-react-app的EXTEND_ESLINT环境变量设置为true 。 文档在这里。

有几种不同的方式来设置这个环境变量。 例如，您可以在项目文件夹的根目录中创建一个.env文件，内容如下：

EXTEND_ESLINT=true

从文档中，我相信这是一个实验性功能，但它为eslint-loader提供了eslint配置。 在设置启用此之前，我必须手动评论

/* global chrome */

在每个文件中，因为构建过程没有使用我的eslint配置，因此没有意识到我将chrome设置为全局。

虽然这个问题没有提到create-react-app ，但我相信很多人会在与我相同的情况下来到这个问题。

Answer 4

正如评论中提到的，没有chrome环境，您可以在 eslint docs 中找到有关可配置环境的更多信息。

您可以将每个文件的全局变量指定为顶行注释，或者在您的配置文件中，请参阅指定 global 。 您还可以编写自定义 Eslint Chrome 插件来设置全局变量和解析器选项（这是环境为您所做的）并将其导入到您的配置文件中。