logo标签列表

ESLint规则"import/extensions"的定义未找到。

typescriptvisual-studio-codeeslinteslintrceslint-config-airbnb
61

我在使用VS Code中的ESLint检查TypeScript文件时遇到以下两个错误：

Definition for rule 'import/extensions' was not found.eslint(import/extensions)
Definition for rule 'import/no-extraneous-dependencies' was not found.eslint(import/no-extraneous-dependencies)

VSC问题面板的截图：

在此输入图片描述

关于可能的重复说明

有许多关于不同模块甚至是import/extensions的类似问题，但没有建议的解决方案能够帮助。 我已经尝试了它们所有。 在编写这篇问题时，我还尝试了Stack Overflow建议的每个线程中发布的每个解决方案。

这是我的.eslintrc.json：

{
  "env": {
      "es2021": true,
      "node": true
  },
  "extends": [
      "airbnb-typescript/base",
      "plugin:@typescript-eslint/recommended"
  ],
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
      "ecmaVersion": 12,
      "sourceType": "module",
      "project": "./tsconfig.json"
  },
  "plugins": [
      "@typescript-eslint"
  ],
  "rules": {
      "@typescript-eslint/no-use-before-define": "off"
  }
}

package.json:

{
  "name": "graph-userdata-gateway",
  "version": "1.0.0",
  "description": "Gateway for PowerApps Microsoft Graph API custom connector to query user data with application permissions.",
  "main": "src/index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git@gitlab.yobitti.fi:powerapps/graph-userdata-gateway.git"
  },
  "author": "Benjamin Pettinen / YO-bitti Oy",
  "license": "UNLICENSED",
  "dependencies": {
    "@microsoft/microsoft-graph-client": "^3.0.0",
    "dedent": "^0.7.0",
    "express": "^4.17.1",
    "isomorphic-fetch": "^3.0.0",
    "md5": "^2.3.0",
    "node-fetch": "^2.6.1"
  },
  "devDependencies": {
    "@types/dedent": "^0.7.0",
    "@types/express": "^4.17.13",
    "@types/isomorphic-fetch": "0.0.35",
    "@types/md5": "^2.3.1",
    "@types/node-fetch": "^2.5.12",
    "@typescript-eslint/eslint-plugin": "^4.29.2",
    "@typescript-eslint/parser": "^4.29.2",
    "eslint": "^7.32.0",
    "eslint-config-airbnb-base": "^14.2.1",
    "eslint-config-airbnb-typescript": "^13.0.0",
    "eslint-plugin-import": "^2.24.1",
    "typescript": "^4.3.5"
  }
}

tsconfig.json

{
  "compilerOptions": {
    "target": "ES6",
    "module": "CommonJS",
    "esModuleInterop": true,
    "noImplicitAny": true,
    "moduleResolution": "Node",
    "outDir": "dist",
    "sourceMap": true
  }
}

我尝试删除整个node_mobules目录并重新运行npm install，还调整了.eslintrc.json文件中的extends选项。如果我移除airbnb-typescript/base则错误消失了，但这样我就失去了ESLint中Airbnb风格的设置。使用airbnb-base代替可以解决问题，但ESLint会报错Missing file extension for abc.ts和Unable to resolve path to module abc。我也多次重启了VSC和ESLint服务。

你能把你的代码库发到这里吗？这样可以更好地跟踪和尝试解决问题。 - Ryan Le
5个回答
129
非常感谢！昨天我花了好几个小时来解决这个问题，而这个小插件的添加一劳永逸地解决了它。奇怪的是，在之前的所有具有完全相同配置的存储库中，我都没有需要过这个插件，但我猜即使在 eslint、typescript 和 airbnb 风格指南的次要版本之间，事情也会发生变化。 - AirPett
1
先生，您获得了奖品！我刚刚花了一个多小时来解决这个问题，这是“只有在最后一个地方找到你要找的东西”的情况！为什么我不能先找到这个呢... - Big Rich
如果您没有立即看到修复效果：请删除node_modules目录和package-lock.json文件，运行npm install并重新启动IDE :) - Ovidijus Parsiunas
对于使用React 18+/TS/CRA的人，我建议使用"plugins": ["import"]，而不是"extends": ["plugin:import/recommended"]，因为出于某种原因，你会得到类似于 web-vitals ^2.1.4中找不到"web-vitals"的ReportHandler的错误。 - jxc
32

针对那些在将Typescript Airbnb配置升级到v13+之后前来查看并想要了解变化的人：

请仔细阅读最新版本的eslint-config-airbnb-typescript项目的README。

确保您已经设置了常规的Airbnb配置。如果您没有使用React，请参见eslint-config-airbnb，或者eslint-config-airbnb-base。

这听起来像是对旧设置的一些新变化，而事实上确实如此。这是因为在v13中有一个重大变化。

让我们按照建议去做。

根据eslint-config-airbnb-base的说明，您应该将eslint-config-airbnb-base及其对等依赖项添加到您的package.json中。最简单的方法是：npx install-peerdeps --dev eslint-config-airbnb-base。现在，此命令将同时将eslint-config-airbnb-base和eslint-plugin-import添加到您的package.json中：

     "eslint": "^8.7.0",
+    "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-airbnb-typescript": "^16.1.0",
+    "eslint-plugin-import": "^2.25.4",

最后一步将是在 eslint 配置的 extends 数组中添加 airbnb-base，在 airbnb-typescript/base 之前：
   plugins: ["@typescript-eslint"],
   extends: [
+    "airbnb-base",
     "airbnb-typescript/base",

这就是解决方案！问题现在应该已经被修复了。
1
在我的情况下，我通过将 "allowSyntheticDefaultImports" 设置添加到 "tsconfig.json" 中的 "compilerOptions" 中来解决了这个问题。
{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
  }
}
1
如果您正在使用 .eslintrc.js，请添加以下内容。
module.exports = {
  ...otherSetting,
  plugins: ["import"],
}
0
如果配置没有问题，
由npm依赖项hoisting引起的问题
项目根目录将依赖于与推广安装不匹配的eslint，因为插件报告错误ESLint Definition for rule 'xxx' is not found
我在一篇文章中详细介绍了解决问题的过程：https://www.yuque.com/cloudyan/faq/py7xb5
2
当链接到您自己的网站或内容（或与您有关联的内容）时，您必须在答案中披露您的关联，以便不被视为垃圾邮件。在用户名中具有与URL相同的文本或在个人资料中提及它不被视为足够的披露根据Stack Exchange政策。 - cigien
1
虽然这个链接或许可以回答问题，但最好还是在这里包含必要的答案部分，并提供链接作为参考。仅有链接的答案如果链接页面发生变化就会失效。- 【来自审查】 - configbug
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接