错误 'document' 未定义：eslint / React

Question

我正在使用 create-react-app 构建一个 React 应用程序。

我在运行 ESLint 时遇到以下错误：
8:3 error 'document' is not defined no-undef.

我的应用程序运行没有错误，但我在 2 个文件中遇到了这个 ESLint 错误。查看其中一个 .jsx 文件和我的 ESLint 配置。

index.jsx:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import './index.css';

ReactDOM.render(
  <App />,
  document.getElementById('root'),
);

eslintrc.js:

module.exports = {
  "extends": "airbnb",
  "plugins": [
      "react",
      "jsx-a11y",
      "import"
  ],
  "env": {
    "jest": true
  }
};

我该如何解决这个问题？目前我会简单地忽略这两个文件......但我宁愿找到一个长期的解决方案。

Answer 1

添加 "browser": true 您的 env 以包含全局变量（如文档、window 等）

有关详细信息，请参阅 ESLint environment documentation。

Answer 2

在你的package.json中指定jest的测试环境为"jsdom"如下：

  "jest": {
    "testEnvironment": "jsdom"
  }

我遇到了同样的问题，它对我来说效果很好。

Answer 3

在您的 eslint.rc 文件中设置环境属性，例如

{
    "env": {
        "browser": true,
        "node": true
    }
}

Answer 4

如果您有 .eslintrc.json 文件，请添加以下代码段。

{
    ...otherSettings,
    "env": {
        "browser": true,
        "node": true
    }
}

如果您没有 .eslintrc.json，那么您可以在 package.json 文件中添加这些设置。

{
    ...otherSettings,
    "eslintConfig": {
      "globals": {
        "window": true
      }
    }
}

错误 'document' 未定义：eslint / React

error 'document' is not defined : eslint / React

jsx

jsdom

reactjs

jestjs