1. eslint-plugin-unused-imports
Report and remove unused es6 modules
eslint-plugin-unused-imports
Package: eslint-plugin-unused-imports
Created by: sweepline
Last modified: Tue, 30 Apr 2024 14:52:17 GMT
Version: 3.2.0
License: MIT
Downloads: 9,053,243
Repository: https://github.com/sweepline/eslint-plugin-unused-imports

Install

npm install eslint-plugin-unused-imports
yarn add eslint-plugin-unused-imports

eslint-plugin-unused-imports

Find and remove unused es6 module imports. It works by splitting up the no-unused-vars rule depending on it being an import statement in the AST and providing an autofix rule to remove the nodes if they are imports. This plugin composes the rule no-unused-vars of either the typescript or js plugin so be aware that the other plugins needs to be installed and reporting correctly for this to do so.

Versions

  • Version 3.x.x is for eslint 8 with @typescript-eslint/eslint-plugin 6 - 7
  • Version 2.x.x is for eslint 8 with @typescript-eslint/eslint-plugin 5
  • Version 1.x.x is for eslint 6 and 7.

Important for version 1.1

The -ts rules are deprecated, the package now looks for @typescript-eslint/eslint-plugin to exist to decide between the typescript and eslint version.
The -ts rule will still work, but point to the new rule instead.

Typescript

If running typescript with @typescript-eslint make sure to use both @typescript-eslint/eslint-plugin and @typescript-eslint/parser.

React

If writing react code you need to install eslint-plugin-react and enable the two rules react/jsx-uses-react and react/jsx-uses-vars. Otherwise all imports for components will be reported unused.

Installation

You'll first need to install ESLint (and @typescript-eslint if using typescript):

 npm i eslint --save-dev

Next, install eslint-plugin-unused-imports:

 npm install eslint-plugin-unused-imports --save-dev

Note: If you installed ESLint globally (using the -g flag) then you must also install eslint-plugin-unused-imports globally.

Usage

Add unused-imports to the plugins section of your .eslintrc configuration file. You can omit the eslint-plugin- prefix:

{
	"plugins": [<other_plugins_you_use>, "unused-imports"]
}

Then configure the rules you want to use under the rules section. I can recommend adding a check for underscores, e.g.

{
    "rules": {
        "no-unused-vars": "off", // or "@typescript-eslint/no-unused-vars": "off",
        "unused-imports/no-unused-imports": "error",
        "unused-imports/no-unused-vars": [
            "warn",
            {
                "vars": "all",
                "varsIgnorePattern": "^_",
                "args": "after-used",
                "argsIgnorePattern": "^_",
            },
        ],
    },
}

Supported Rules

  • no-unused-imports
  • no-unused-vars

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin