為什么 ESLint 會為 TypeScript 接口拋出“no-unused-vars”？

Question

所以，我在 .ts 文件中有這段代碼：

import {MicroEventInterface} from '../Interfaces';

export default class MicroEvent implements MicroEventInterface {

// code

ESLint 會拋出這個錯誤：

我在 ESLint 中有這個 TypeScript 的配置：

typescript: {
    extends: [
        'plugin:@private/private/react' // private rep with React config
    ],
    parser: '@typescript-eslint/parser',
    plugins: [
        '@typescript-eslint',
        'import'
    ],
    settings: {
        'import/resolver': {
            'node': {
                'extensions': [
                    '.js',
                    '.jsx',
                    '.ts',
                    '.tsx'
                ],
                'moduleDirectory': [
                    'node_modules/',
                    'src/'
                ]
            }
        },
        react: {
            createClass: 'createClass',
            pragma: 'React',
            version: '0.14.9'
        }
    }
}

所以，一切似乎都很好，但我無法克服這個錯誤。

有什么建議么？

謝謝！

升級版：

看起來如果我console.log( --- , MicroEventInterface); 錯誤消失。 我認為，ESLint 不會將implements視為實際使用。

Answer 1

資料來源：我是typescript-eslint項目的維護者。

@typescript-eslint工具的最新版本現在完全支持范圍分析。

所以現在解決這個問題的步驟是：

• 將您的版本更新到至少 v4.9.1 的@typescript-eslint/parser和@typescript-eslint/eslint-plugin
• 將您的 ESLint 版本更新到至少 v6.0.0
• 更新您的配置以使用@typescript-eslint/no-unused-vars
  • 不要使用基本的no-unused-vars規則 - 請參閱項目中的此常見問題解答文章。

重新啟動 IDE，您現在應該會看到正確的 lint 錯誤。

Answer 2

使用@typescript-eslint/no-unused-vars-experimental並關閉@typescript-eslint/no-unused-vars 。

該問題在后一個版本（實驗性）中得到解決。

示例配置：

// .eslintrc
{
  ...
  "rules": {
    "@typescript-eslint/no-unused-vars": "off",
    "@typescript-eslint/no-unused-vars-experimental": "error"
  }
  ...
}

Answer 3

將此添加到 Eslint 規則

"rules": {
  "@typescript-eslint/no-unused-vars": [
    2,
    {
      "args": "none"
    }
  ]
}

Answer 4

將以下規則添加到您的.eslintrc.json文件中

{
  rules: {
    "@typescript-eslint/no-unused-vars": "warn",
  }
}

Answer 5

使用varsIgnorePattern規則

為了在純 TypeScript 項目中解決這個問題，我在我的 eslint 配置文件 ( .eslintrc.json ) 中添加了以下規則。 要使此特定解決方案起作用，您必須遵循接口名稱以大寫“I”開頭的約定。

順便說一句，在考慮是否使用它們時，它們名稱的第一個字母為大寫“I”的其他工件（即類）也將被忽略。

埃斯林特

...
    "rules": {
        ... other rules omitted ...,
        "no-unused-vars": [
            "warn",
            { 
                "vars": "all",
                "varsIgnorePattern": "[I]\\w+"
            }
        ]
    }
...

有關此規則的更多信息，請參閱文檔。

Answer 6

因此，我在.ts文件中有這段代碼：

import {MicroEventInterface} from '../Interfaces';

export default class MicroEvent implements MicroEventInterface {

// code

ESLint會引發此錯誤：

我在ESLint中具有TypeScript的此配置：

typescript: {
    extends: [
        'plugin:@private/private/react' // private rep with React config
    ],
    parser: '@typescript-eslint/parser',
    plugins: [
        '@typescript-eslint',
        'import'
    ],
    settings: {
        'import/resolver': {
            'node': {
                'extensions': [
                    '.js',
                    '.jsx',
                    '.ts',
                    '.tsx'
                ],
                'moduleDirectory': [
                    'node_modules/',
                    'src/'
                ]
            }
        },
        react: {
            createClass: 'createClass',
            pragma: 'React',
            version: '0.14.9'
        }
    }
}

因此，一切似乎都很好，但我無法克服這個錯誤。

有什么建議么？

謝謝！

UPD：

看起來就像我console.log( --- , MicroEventInterface); 錯誤消失。 我認為，ESLint不會將implements視為實際用法。