未找到规则“导入/扩展”的 ESLint 定义

Posted

技术标签:

【中文标题】未找到规则“导入/扩展”的 ESLint 定义【英文标题】:ESLint Definition for rule 'import/extensions' was not found 【发布时间】:2021-10-22 22:52:52 【问题描述】:

我在 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.tsUnable to resolve path to module abc。我也多次重启 VSC 和 ESLint 服务器。

【问题讨论】:

你能把你的repo发到这里吗,它有助于更​​正确地追踪/尝试问题? 【参考方案1】:

您错过了将其添加到您的 eslint.json 文件中。

"plugins": ["import"],

或者,

"extends": ["plugin:import/recommended"]

参考:https://github.com/import-js/eslint-plugin-import#resolvers

【讨论】:

非常感谢!昨天花了几个小时试图解决这个问题,插件的这个小补充一劳永逸地修复了它。很奇怪,因为我在以前的任何具有完全相同配置的存储库中都不需要它,但我想即使在 eslint、typescript 和 airbnb 样式指南的次要版本之间,情况也会发生变化。 你得奖了,先生!我刚刚花了一个多小时试图解决这个问题,这是一个“只在你寻找的最后一个地方找到你正在寻找的东西!”的情况。 - 为什么我不能先找到这个.... 如果您没有看到修复立即生效:删除 node_modules 目录和 package-lock.json 文件,运行 npm install 并重新启动您的 IDE :)【参考方案2】:

对于那些在将 Typescript Airbnb 配置升级到 v13+ 并想了解发生了什么变化的人:

Read carefully the most recent README of the eslint-config-airbnb-typescript project.

确保您有常规的 Airbnb 配置设置。如果您不使用 React,请参阅 eslint-config-airbnbeslint-config-airbnb-base

对于您的旧设置来说,这听起来像是新东西,而且确实如此。 那是因为有一个breaking change in v13

让我们听从建议吧。

根据eslint-config-airbnb-base instructions,您应该将eslint-config-airbnb-base 添加到您的package.json 中。最简单的方法:npx install-peerdeps --dev eslint-config-airbnb-base。现在这个命令会将(eslint-config-airbnb-baseeslint-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",

最后一步是在 airbnb-typescript/base 之前添加 airbnb-baseextends eslint 配置数组:

   plugins: ["@typescript-eslint"],
   extends: [
+    "airbnb-base",
     "airbnb-typescript/base",

就是这样!这个问题现在应该解决了。

【讨论】:

谢谢,这是我的确切问题和解决它的正确方法。【参考方案3】:

就我而言,我可以通过将“allowSyntheticDefaultImports”设置添加到“tsconfig.json”中的“compilerOptions”来修复它。


  "compilerOptions": 
    "allowSyntheticDefaultImports": true,
  

【讨论】:

以上是关于未找到规则“导入/扩展”的 ESLint 定义的主要内容,如果未能解决你的问题,请参考以下文章

(ESLint) 未找到规则“re​​act/jsx-sort-prop-types”的定义

未找到规则“re​​act-hooks/exhaustive-deps”的定义

禁用未找到 eslint 规则的警告消息

在哪里可以找到“eslint:recommended”的规则定义?

eslint自定义关闭某个规则

Javascript 和 ESLint 中的全局变量