ESLint 简介
ESLint 是一个用于检测和定位 JavaScript 代码问题的工具。它可以检测语法错误、未使用变量、不符合规范的代码风格等问题，帮助保证代码质量和可读性。ESLint 可以在 JavaScript 文件、Babel、TypeScript 等环境下运行。
模块路径错误
在使用 ESLint 进行代码检测时，有时会遇到模块路径错误的问题。这通常是因为 ESLint 不知道如何解决模块路径引用。当使用 import 或 require 引用模块时，如果代码中使用了相对路径，那么 ESLint 会尝试根据相对位置寻找模块。如果模块路径错误，则会出现以下错误提示：
"import" should be listed in the project's dependencies. Run 'npm install --save import' to add it (import/no-extraneous-dependencies)
这个错误提示告诉我们，在导入模块时，在项目的依赖项中找不到 "import" 模块。这是因为在未正确配置模块路径时，ESLint 在寻找模块时会优先在 node_modules 中查找，如果找不到则会提示找不到模块。
解决方法
要解决 ESLint 遇到模块路径错误的问题，需要正确配置模块路径。一般来说，有两种方法可以解决这个问题。
方法一：添加 .eslintignore 配置文件
我们可以在项目的根目录下添加一个 .eslintignore 文件，告诉 ESLint 忽略这些错误。
node_modules/ *.spec.js
这个 .eslintignore 文件包含了两条规则：忽略 node_modules 文件夹和以 .spec.js 结尾的文件。
这种方法虽然可以解决问题，但并不是最优的解决方法。因为它只是忽略了错误提示，而没有真正解决问题。
方法二：添加 .eslintrc 配置文件
我们可以在项目的根目录下添加一个 .eslintrc 文件，告诉 ESLint 如何处理模块路径问题。
-- -------------------- ---- -------
-
----------- -
------------------ -
------- -
------------------ ---------------- ------
-
-
-
-这个 .eslintrc 文件包含了一个 settings 配置项，它告诉 ESLint 如何解决模块路径问题。在这个配置中，我们使用了 import/resolver 这个插件来配置模块路径解析规则。其中，moduleDirectory 指定了模块搜索路径，我们指定了 node_modules 和 src 两个路径。这意味着当 ESLint 在寻找模块时，会优先在这两个路径中查找，从而解决模块路径错误的问题。
示例代码
下面是一个示例代码，它演示了在使用 ESLint 进行代码检测时遇到模块路径错误的问题。
假设我们有一个项目结构如下：
-- -------------------- ---- ------- -------- --- ------------- --- ---- - --- -------- - --- ------ - - --- ---------- --- --------- --- ------------ --- ---------
其中，index.js 文件包含了如下代码：
import { getSomething } from "./utils/helpers";
function doSomething() {
return getSomething();
}我们运行 ESLint 检测代码，它会输出如下错误提示：
"import" should be listed in the project's dependencies. Run 'npm install --save import' to add it (import/no-extraneous-dependencies)
这是因为 ESLint 无法解决相对路径引用模块的问题。我们可以通过添加 .eslintrc 配置文件来解决这个问题。在 .eslintrc 文件中添加如下配置：
-- -------------------- ---- -------
-
----------- -
------------------ -
------- -
------------------ ---------------- ------
-
-
-
-然后再次运行 ESLint，此时就不会再输出相对路径错误提示了。
总结
本篇文章介绍了 ESLint 遇到模块路径错误的解决方法，包括添加 .eslintignore 配置文件和添加 .eslintrc 配置文件两种方法。其中，添加 .eslintrc 配置文件是最优的解决方法，可以真正解决模块路径错误的问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c86f9d5ad90b6d041395d6