如何从 React Typescript 的整个项目中删除未使用的导入/声明？

Question

我正在尝试删除未使用的导入和声明，如 Angular 的 这个 SO 线程 中所回答的那样。我正在尝试使用 eslint-plugin-react 来实现目标，但没有找到任何选项来使用单个命令从整个项目中删除未使用的导入和声明。

这是我的 .eslintrc.json

 {
    "env": {
        "browser": true,
        "es2021": true
    },
    "extends": [
        "eslint:recommended",
        "plugin:react/recommended",
        "plugin:@typescript-eslint/recommended"
    ],
    "parser": "@typescript-eslint/parser",
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        },
        "ecmaVersion": 12
    },
    "plugins": [
        "react",
        "@typescript-eslint",
        "unused-imports"
    ],
    "rules": {
        "indent": [
            "warn",
            "tab"
        ],
        "linebreak-style": [
            "warn",
            "windows"
        ],
        "quotes": [
            "warn",
            "double"
        ],
        "semi": [
            "warn",
            "always"
        ],
        "@typescript-eslint/no-unused-vars": "on",
        "unused-imports/no-unused-imports-ts": "on"
    }
}

或者有没有办法在 VS Code 中使用 ESLint 或 Typescript Hero 扩展来做同样的事情？

原文由 DevLoverUmar 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

使用 unused-imports 插件和 unused-imports/no-unused-imports-ts 规则， eslint --fix 将删除 import 。

这是一个示例 repo，其中 --fix 删除了未使用的 import s。

https://github.com/moshfeu/eslint-ts-unused-imports

旧答案

eslint 有一个内置的 修复 选项。

 eslint ... --fix

如果 rules 包含 no-unused-vars ，eslint 将通过删除它们（以及其他 自动修复）来“修复”未使用的导入。

原文由 Mosh Feu 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

您还可以在 VSCode 中使用快捷方式，如果需要快速完成且无需额外努力：

Option + Shift + O 适用于 Mac

Alt + Shift + O 适用于 Windows

原文由 Vadym 发布，翻译遵循 CC BY-SA 4.0 许可协议