解决 ESLint 的 require() 错误
什么是 ESLint？
ESLint 是一个开源 JavaScript 代码检查工具，用于发现代码中的问题，并且尽可能自动的通过插件扩展规则，支持各种代码风格的检测。通过统一项目代码风格，提高代码的可维护性，减少代码缺陷和错误，从而为团队开发提供更好的协作利器。
什么是 require()？
Node.js 中提供了全局变量 require()，用来加载模块或其他 JavaScript 文件。require() 的工作原理是在全局作用域下执行指定的 JavaScript 文件，并且获取该文件输出的模块接口对象。换言之，require() 是 Node.js 的核心模块，并且对于 Node.js 应用程序开发至关重要。
为什么在使用 ESLint 时会出现 require() 错误？
在使用 ESLint 进行代码检查时，如果使用了 require() 函数引入 jQuery、React、Vue 等第三方库，就会出现以下错误，例如：
------ ------- -- --- -------- ----------
原因是 ESLint 默认无法识别全局变量，如果未正式声明这些全局变量，就会产生左侧的错误提示。而且，这种 require() 错误会导致代码质量分数下降，降低检测报告的可靠性和可读性。
怎样解决 ESLint 的 require() 错误？
方式一：使用 eslint-plugin-require-path-exists
可以使用 eslint-plugin-require-path-exists 插件对 require() 语句的路径验证做进一步处理，从而消除这种错误。具体步骤如下：
安装
eslint-plugin-require-path-exists插件，全局安装或项目安装均可：--- ------- --------------------------------- ----------
在 .eslintrc 文件中添加
"require-path-exists/no-unresolved": 2配置：- ---------- - --------------------- -- -------- - ------------------------------------ - - -重新执行 ESLint 命令，等待提示信息出现即可。
方式二：配置 .eslintrc 中的 global
可以在 .eslintrc 中配置 global 项，声明全局变量，并让 ESLint 忽略这些全局变量，从而消除 require() 错误。具体步骤如下：
编辑 .eslintrc 文件，在 rules 属性下添加以下内容：
- -------- - ----------- ------- -- ---------- - ---- ----- -------- - ----- -------- ----- ----------- ---- - -在 globals 中列出需要声明的全局变量即可，$ 代表 jQuery，其他类似。
重新执行 ESLint 命令，等待提示信息出现即可。
示例代码
以 React 为例，展示 require() 错误的解决方法：
-- ----
------ ------ - --------- - ---- --------
----- --- ------- --------- -
-------- -
------ -
-----
---------- -----------
------
--
-
-
------ ------- ----以上代码中，ESLint 会报出以下错误：
------ ------- -- --- -------- ----------
因为忘记显式地声明 React 变量。
解决方法：
-- ---- ---- -----------------------------------
------ ------ - --------- - ---- --------
----- --- ------- --------- -
-------- -
------ -
-----
---------- -----------
------
--
-
-
------ ------- ----或者
-- ---- ---- --------- -- ------
-- --------- --
-
-------- -
----------- -------
--
---------- -
---- -----
-------- - -----
-------- -----
----------- ----
-
-
-- ------ --
------ ------ - --------- - ---- --------
----- --- ------- --------- -
-------- -
------ -
-----
---------- -----------
------
--
-
-
------ ------- ----总结：
通过使用 ESLint 检测 JavaScript 代码，可以提高代码质量和可读性，增强开发协作的有效性。在遇到 require() 错误时，可以使用 eslint-plugin-require-path-exists 插件或在 .eslintrc 文件中配置 global 变量来解决。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64a93c2948841e9894580f58