Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

916
Views
How can I remove unused imports/declarations from the entire project of React Typescript?

I'm trying to remove unused imports and declarations as answered in this SO thread for Angular. I'm trying to achieve the goal using eslint-plugin-react, but not found any option to remove the unused imports and daclarations from the entire project, with a single command.

Here is my .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"
    }
}

Or is there a way to do the same using ESLint or Typescript Hero extensions in VS Code?

over 4 years ago · Santiago Trujillo
3 answers
Answer question

0

Using unused-imports plugin and unused-imports/no-unused-imports-ts rule, eslint --fix will remove the imports.

Here is an example repo which --fix removes the unused imports.

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

Old answer

eslint has a built-in fix option.

eslint ... --fix

If rules contains no-unused-vars, eslint will "fix" the unused import by removing them (along with other auto fixes).

over 4 years ago · Santiago Trujillo Report

0

You can also use shortcuts in VSCode, if needs to be done quick and without extra effort:

Option + Shift + O for Mac

Alt + Shift + O for Windows

over 4 years ago · Santiago Trujillo Report

0

TL;DR

Use unused-imports/no-unused-imports instead of no-unused-vars, as rule name.


If you're using the ESLint version, eslint-plugin-unused-imports, you may want to change the rule name to unused-imports/no-unused-imports instead of the blanket no-unused-vars.

{
    "rules": {
        "unused-imports/no-unused-imports": "error"
    }
}

Refer to the author's GitHub for detailed usage.

For me, no-unused-var does not come with an auto fixer (it'll merely mentioned then number of errors/warnings but when I switch to unused-imports/no-unused-imports, all of the issues are automagically fixed.

over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!