@typescript-eslint插件加载失败：无法找到模块“eslint-plugin-@typescript-eslint”。

Question

我正在将项目从tslint重新配置为eslint。我可以手动运行eslint，但webpack运行时会出现以下错误信息：

Module build failed (from /path/node_modules/eslint-loader/index.js):
Error: Failed to load plugin @typescript-eslint: Cannot find module 'eslint-plugin-@typescript-eslint'

我排除了 .eslintrc.js 文件和缺失的依赖项，因为当我手动运行 ./node_modules/eslint/bin/eslint.js ./ --ext .ts,.tsx --config ./.eslintrc.js 时它可以工作。

我不确定这是否是 eslint-loader 的上游问题。

module.exports = {
  parser: "@typescript-eslint/parser",
  plugins: ["@typescript-eslint"],
  extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended", "plugin:react/recommended", "plugin:jest/recommended", "prettier", "prettier/@typescript-eslint"],
  rules: {
    "react/prop-types": false
  },
  parserOptions: {
    ecmaVersion: 6,
    project: "./tsconfig.json",
    sourceType: "module"
  },
  settings: {
    react: {
      version: "detect"
    },
    linkComponents: [
      {"name": "Link", "linkAttribute": "href"}
    ]
  },
  env: {
    browser: true
  }
};

我的 package.json 文件

{
    "dependencies": {
        "@emotion/core": "10.0.6",
        "facepaint": "1.2.1",
        "react": "16.7.0",
        "react-dom": "16.7.0",
        "react-redux": "6.0.0",
        "redux": "4.0.1",
        "tslib": "1.9.3"
    },
    "devDependencies": {
        "@types/node": "10.12.21",
        "@types/react": "16.8.1",
        "@types/react-dom": "16.0.11",
        "@types/react-redux": "7.0.1",
        "@typescript-eslint/eslint-plugin": "1.2.0",
        "eslint": "5.13.0",
        "eslint-config-prettier": "4.0.0",
        "eslint-plugin-jest": "22.2.2",
        "eslint-plugin-react": "7.12.4",
        "tsconfig-paths-webpack-plugin": "3.2.0",
        "typescript": "3.2.1"
    }
}

- Thilak Rao

---

你尝试过执行“npm i eslint”吗？ 我通过更新eslint来解决了相同的问题。 - Λlisue

是的，我的依赖项已经更新了。 - Thilak Rao

Answer 1

您需要升级您的eslint版本，在错误信息中您可以看到一个不良的前缀eslint-plugin-，由于eslint/lib/config/plugins.js中的某些常量在以后的版本中已被删除。

- krulik

---

我使用 eslint-loader。刚刚发现它使用的是较旧版本的 eslint，除非您使用配置选项指定 eslint 的路径。我已经修复了它，但遇到了其他问题。看起来 eslint-loader 不支持最新版本的 eslint。 - Thilak Rao

@ThilakRao 你尝试相应地更新 eslint-loader 了吗？ - krulik

@krulik，是的，我使用的是最新版本的eslint-loader(v2.1.2)，但并没有解决我的问题。 - Thilak Rao

我正在使用 "eslint": "^6.1.0" 和 "eslint-loader": "^2.0.0"，但仍然出现相同的错误。 - Damian Green

升级 Eslint 只需运行 npm i -G eslint。 - Oleksandr Grin

Answer 2

更新ESlint在我的情况下解决了这个问题。

npm i eslint

- Matoeil

Answer 3

我通过将 package.json 文件中所有的 ^ 替换为空来解决了此错误，然后运行 npm i。

- Jeff Tian

---

这是一个非常错误的建议。它可能会导致您的项目崩溃。 - Jakub Hrubý

为什么？它只是固定了所有软件包的版本，这在严肃的开发中非常常见，因为这样更安全。 - Jeff Tian

之所以这样做是错误的，是因为“^”是 semVer 版本控制中使用的符号，它标志着版本应该有多具体。在这种情况下，简单地删除此符号可能已经解决了问题（因为它导致 npm 安装了不同版本的 eslint），但这很可能会产生许多意想不到的后果。因此极不建议这样做，也很危险。 - Brady Dowling

@BradyDowling的说法并不准确。删除 ~ 或 ^ 是指定应使用哪个版本，它不会在您没有明确指示的情况下更新依赖项。 ~ 表示它只会更新构建版本，而不会更新次版本。 ^ 表示它将更新次版本和构建版本，但不会更新主版本。在这方面，您可以控制何时更新到新版本。因此，在技术上讲，这并不是错误的。 - c0dezer019

@JeffTian，你的做法是错误的，因为你对每个包都执行了一次全盘操作。你进行了一次全盘操作来解决与某个包相关的问题，但你可能不知道哪个包引起了这个问题。全盘移除语义化版本号（SemVer）可能会破坏你的项目，因为你可能有依赖于特定次要版本中可用功能的其他包功能。你应该只对你知道需要保持固定的包进行去除 SemVer 操作。 - c0dezer019