ESLint 开启报错：'React' is not defined-JavaScript中文网-JavaScript教程资源分享门户

ESLint 开启报错：'React' is not defined

在 React 项目中我们经常会遇到 ESLint 报错 'React' is not defined，这个错误提示是因为 eslint-config-react-app 里面不允许在代码中直接使用全局变量 React。那么我们如何在避免使用全局变量的情况下正常使用 React 呢？

示例代码：

-- -------------------- ---- -------
------ ----- ---- --------

-------- ----- -
  ------ -
    -----
      --- --- -- ---
    ------
  --
-

------ ------- ----

解决方法：

在项目根目录下创建 .env 文件，添加以下代码：
```
REACT_APP_ALLOW_EXPERIMENTAL_RUNTIME_FEATURES=true
```
这个配置将允许我们在代码中使用 React 全局变量。
在 .eslintrc.json 文件中添加以下配置：
```
{
  "globals": {
    "React": "writable"
  }
}
```
该配置将告诉 ESLint React 是全局变量，并且是可写的。

然后在代码中添加以下注释声明：

-- -------------------- ---- -------
-- -------------- --------- -------------- --
------ ----- ---- --------
-- ------------- --------- -------------- --

-------- ----- -
  ------ -
    -----
      --- --- -- ---
    ------
  --
-

------ ------- ----

这个配置将告诉 ESLint 在 import React 的时候不要检查未定义的变量，同时变量未使用也不要检查。

总结：

在使用 React 项目的时候，我们经常会遇到 ESLint 报错 'React' is not defined，通过以上的解决方案可以轻松解决这个问题。同时我们也应该明确在代码中尽量避免使用全局变量，提高代码的可维护性和可复用性。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/64f3fa3ef6b2d6eab3d2daa2