ESLint 无法识别“@typescript-eslint/eslint-plugin”

Posted 2023-03-13

【中文标题】ESLint 无法识别“@typescript-eslint/eslint-plugin”

【英文标题】：ESLint is not recognizing "@typescript-eslint/eslint-plugin"

【发布时间】：2020-04-04 19:44:35

【问题描述】：

我一直试图让 ESLint 在 VS Code 中处理一个新的 Angular 项目，但它无法加载“@typescript-eslint/eslint-plugin”。在过去的 3 个小时里，我一直在试图找出问题所在，并到处寻找解决方案。

Failed to load plugin '@typescript-eslint' declared in 'png-ui/.eslintrc.js': Cannot find module '@typescript-eslint/eslint-plugin'
Require stack:
- /Users/Yahia/Desktop/Plugngrow-UI/__placeholder__.js
Referenced from: /Users/Yahia/Desktop/Plugngrow-UI/png-ui/.eslintrc.js
Happened while validating /Users/Yahia/Desktop/Plugngrow-UI/png-ui/.eslintrc.js
This can happen for a couple of reasons:
1. The plugin name is spelled incorrectly in an ESLint configuration file (e.g. .eslintrc).
2. If ESLint is installed globally, then make sure '@typescript-eslint/eslint-plugin' is installed globally as well.
3. If ESLint is installed locally, then '@typescript-eslint/eslint-plugin' isn't installed correctly.

Consider running eslint --debug /Users/Yahia/Desktop/Plugngrow-UI/png-ui/.eslintrc.js from a terminal to obtain a trace about the configuration files used.

到目前为止我已采取的调试步骤：

我卸载了全局版本以及扩展，然后重新安装了扩展并在项目文件夹中本地安装了 ESLint。 我正在使用全新安装的 Angular 应用程序，该应用程序是使用 Angular ng new 命令创建的。 我运行了eslint --debug /Users/Yahia/Desktop/Plugngrow-UI/png-ui/.eslintrc.js 命令。除了在调试时忽略“.eslintrc.js”文件的警告之外，它不会产生任何警告。

请注意，ESLint 在我做介绍性教程时从 Angular 文档下载的另一个项目中运行良好。

如果这有助于检查，我已经为该项目创建了一个Github repo。

请原谅我在编程和相关工具方面的新颖性。

【问题讨论】：

假设你有那个插件 package.json （因为它在你的 github 仓库中），你是否执行了 npm install 来安装所需的插件？

是的，我做到了。在安装了特定的旧版本的 Tslint@5.18 和 Eslint@5.16 之后，我才让它以某种方式工作。它仍然在这里和那里给我一些偶尔的错误，并且它不能作为另一个项目的最新版本的 Eslint 运行，但它以某种方式工作。我开始相信通过 CLI 创建一个新的 Angular 应用程序是一个问题，因为它安装了 Tslint 作为它的 linter，我猜这会产生某种冲突。老实说，我不确定。

【参考方案1】：

我昨天刚遇到这个问题。 我建议您在本地重新安装“@typescript-eslint/eslint-plugin”并查看帮助。您还可以重新设置 eslintrc.js 文件，并且应该很容易修复。

此链接很有帮助。 https://www.robertcooper.me/using-eslint-and-prettier-in-a-typescript-project