【问题标题】:@typescript-eslint/no-unused-vars false positive in type declarations@typescript-eslint/no-unused-vars 类型声明中的误报
【发布时间】:2020-12-25 06:18:43
【问题描述】:

@typescript-eslint/no-unused-vars 存在一个问题。 所以,我们有类型

type SomeType = (name: string) => void;

我们在带有类型声明的字符串中有 @typescript-eslint/no-unused-vars 错误,表示“名称”已定义但从未使用。。 p>

类型使用示例:

export const LogSomeInfo: SomeType = (name: string) => {
    const a = name;
    console.log(a);
};

或者:

interface CheckboxPropsType {
    value: string,
    onClick(value: string): void
}

并且 eslint 在 onClick... 字符串处中断,表示该值已定义但从未使用过。 即使类型分配正确并且实际的 onClick 处理程序使用该值!

问题:这条规则有什么问题以及为什么它在这种情况下触发。为什么 eslint 将类型/接口中函数的类型声明识别为常规函数?是我的 eslint 配置有问题吗?

"eslint": "^7.7.0", "@typescript-eslint/eslint-plugin": "^3.6.1", "@typescript-eslint/parser": "^4.0.1", "eslint-config-airbnb-typescript": "^9.0.0",

{
  "extends": [
    "airbnb-typescript",
    "airbnb/hooks",
    "plugin:react/recommended",
    "plugin:@typescript-eslint/recommended"
  ],
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    },
    "ecmaVersion": 2018,
    "sourceType": "module",
    "project": "./tsconfig.json"
  },
  "settings": {
    "react": {
      "version": "detect"
    }
  },
  "plugins": ["@typescript-eslint", "react-hooks", "react"],
  "env": {
    "browser": true
  },
  "rules": {
    "object-curly-newline": 0,
    "import/named": ["error"],
    "indent": ["error", 4],
    "react/jsx-indent": ["error", 4],
    "comma-dangle": ["error", "never"],
    "import/prefer-default-export": "off",
    "react/jsx-fragments": "off",
    "arrow-body-style": "off",
    "object-curly-spacing": "off",
    "@typescript-eslint/indent": ["error", 4, {"SwitchCase": 1}],
    "@typescript-eslint/explicit-module-boundary-types": "off",
    "no-undef": "error",
    "react/jsx-indent-props": ["error", 4],
    "max-len": ["error", { "code": 120 }],
    "react/prop-types": "off"
  }
}

【问题讨论】:

  • 为什么选择 eslint-plugin 3.6.1 和 parser 4.0.1?您是否尝试将两者更新到相同的版本(例如 4.0.1)?
  • 遇到了具有相同症状的不同问题。我们使用no-unused-vars 而不是@typescript-eslint/no-unused-vars。将 @typescript-eslint/eslint-plugin 和 @typescript-eslint/parser 升级到 4.9.0 并将以下内容添加到 .eslintrc 解决了这个问题:"no-unused-vars": 0, "@typescript-eslint/no-unused-vars": ["error", { argsIgnorePattern: "^_" }]

标签: javascript reactjs typescript eslint typescript-eslint


【解决方案1】:

你应该更新你的 package.json 中的包:"@typescript-eslint/eslint-plugin": "^4.4.1" 并运行npm install 来安装它,之后如果仍然出现错误,请尝试将其添加到 eslintrc 文件或 eslint 配置中的规则'no-unused-vars': 'off'

【讨论】:

    【解决方案2】:

    之前问过的类似问题检查:Why ESLint throws 'no-unused-vars' for TypeScript interface?

    在 tsconfig.json 中禁用 '@typescript-eslint/no-unused-vars': 0 规则并改为使用 "strict": true"noUnusedLocals": true"noUnusedParameters": true

    【讨论】:

    • 是的。可能是正确的解决方案。您可以禁用此规则,并添加到 tsconfig --noUnusedLocals 和 --noUnusedParameters,或者您可以将 @typescript-eslint/no-unused-vars-experimental 添加到 eslintrc。两种方法都解决了问题
    • no-unused-vars-experimental 是实验性的,此后已被弃用。它将在下一个专业中删除 - 不要使用它。如果您想使用 TS 内置的未使用检查或 eslint 规则,由您决定。 TS 检查会阻止你的构建,所以很多人不喜欢它们。请参阅下面的答案,了解如何修复您的 eslint 配置。
    • 构建将如何被阻止?如果您遵守严格的规定
    • TypeScript 默认发出,只要文件在语法上有效。 --noEmitOnError 不是默认值。
    • 当然这是默认设置 - 但我见过的大多数用户配置都专门重新配置为不发出错误,因此他们不会测试不正确的奇怪代码。这就是为什么这么多用户喜欢使用 TS 选项 - 因为它阻碍了他们的发展。
    【解决方案3】:

    来源:我是typescript-eslint 项目的维护者。

    如果您将@typescript-eslint/parser@typescript-eslint/eslint-plugin 的版本更新到v4.1.0,您将能够使用使@typescript-eslint/no-unused-vars 在所有情况下都能正常工作的最新更改。


    顺便说一句 - 使用 v3.x 的插件,但使用 v4.x 的解析器会使你进入一个非常奇怪的状态,具有未定义和不受支持的行为。

    您应该确保始终使用相同版本的两个包,因为每个版本都是一起发布的。

    【讨论】:

    • 谢谢。我遇到了同样的问题,现在将这两个库从 4.0.1 升级到 4.4.1 后它可以工作了。
    • 这是今天更好的解决方案。确认在 4.20.0 上工作
    • 我使用的是 4.22.1 版本,但仍然收到警告。是否需要任何其他配置来禁用 TypesInterfaces 中的函数参数的 linting?
    • 我在版本 4.29.0 上都有,但我仍然面临这个问题。
    • @Garrett - 更新到最新版本。 4.6.1 大约 10 个月大
    猜你喜欢
    • 2019-07-06
    • 2020-01-25
    • 2021-02-22
    • 2020-03-17
    • 2020-12-11
    • 2020-01-08
    • 2019-12-31
    相关资源
    最近更新 更多