在前端开发中，我们通常使用 ESLint 工具进行代码规范检查，遇到这个错误提示 'import/no-unresolved' should be listed in the project's dependencies 很有可能是因为我们在使用 import 语句时，导入的模块找不到或者没有安装在项目依赖中。那么，该如何处理这个错误呢？下面，让我们一起看看解决方法。
原因分析
在使用 import 语句导入模块时，ESLint 会检查模块是否存在，如果不存在，就会报错。此外，ESLint 还会通过 npm 包中的 rules 进行代码风格检查，其中导入模块的规则是 'import/no-unresolved'，如果发现对应的模块不存在，就会报错 'import/no-unresolved' should be listed in the project's dependencies。
解决方案
针对这个错误提示，我们可以采取以下两种解决方案。
方案一：安装对应的 npm 包
如果我们确实需要使用导入的模块，那么我们可以通过 npm 安装这个模块，或者安装对应的依赖包。例如，在 Vue 项目中，我们想要使用 Vue Router，那么我们可以在命令行中输入以下命令安装：
npm install vue-router
安装完成后，我们需要在代码中使用 import 语句导入这个模块，才能成功解决问题。
方案二：关闭 'import/no-unresolved' 规则
如果我们并不需要使用导入的模块，或者我们认为当前的项目结构并不需要安装额外的 npm 包，那么我们可以关闭 'import/no-unresolved' 规则。在 .eslintrc.js 中添加以下配置即可：
module.export = {
rules: {
'import/no-unresolved': 'off'
}
}总之，我们需要根据实际情况来选择合适的方案。
示例代码
假设我们在 Vue 项目中使用 Vuex，但是在安装 Vue 和 Vuex 的依赖时，我们漏掉了 Vuex，这时候，在使用 import 语句导入 Vuex 模块时，就会遇到上述错误提示。我们可以通过以下代码解决这个问题。
- 安装 Vuex 包
npm install vuex
- 在代码中引入 Vuex
import Vuex from 'vuex' Vue.use(Vuex)
总结
通过本文的介绍，我们可以清楚地了解到使用 import 语句时出现 'import/no-unresolved' 错误提示的原因，并根据实际情况选择合适的解决方案。同时，我们也需要时刻养成良好的代码规范以及使用工具进行代码规范检查和错误排查的习惯，以避免类似问题的出现。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64758a18968c7c53b029181e