CODEWITHSUNDEEP
typescripteslinttypescript-eslint
Nikita Shchypyplov
Nikita Shchypyplov

Reputation: 1160

Why ESLint throws 'no-unused-vars' for TypeScript interface?

So, I have this piece of code in .ts file:

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

export default class MicroEvent implements MicroEventInterface {

// code

And ESLint throws this error:

error

I have this config for TypeScript in ESLint:

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'
        }
    }
}

So, everything seems like fine, but I can't conquer this error.

Any suggestions?

Thanks!

UPD:

Looks like if I console.log( --- , MicroEventInterface); error disappears. I think, ESLint does not treat implements as actual usage.

Upvotes: 56

Views: 39530

Answers (5)

Artem Bochkarev
Artem Bochkarev

Reputation: 1360

add this to Eslint rules

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

Upvotes: 24

Jason
Jason

Reputation: 2850

Using the varsIgnorePattern Rule

To solve this issue in a pure TypeScript project, I added the following rule to my eslint config file (.eslintrc.json). For this particular solution to work, you must follow the convention that interface names begin with an upper case "I".

Incidentally, other artifacts (namely classes) with the first letter of their name being an upper case "I" will also be ignored when considering whether they are used.

Eslint

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

For more information on this rule, see the documentation.

Upvotes: 1

Brad Zacher
Brad Zacher

Reputation: 3265

Source: I am the maintainer of the typescript-eslint project.

The latest version of the @typescript-eslint tooling now has full support for scope analysis.

So the steps to fix this are now:

  • update your versions to at least v4.9.1 of @typescript-eslint/parser and @typescript-eslint/eslint-plugin
  • update your ESLint version to at least v6.0.0
  • update your config to use @typescript-eslint/no-unused-vars

Restart your IDE and you should now see the correct lint errors.

Upvotes: 74

Ray
Ray

Reputation: 241

Add the following rule to your .eslintrc.json file

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

Upvotes: 2

Christopher Regner
Christopher Regner

Reputation: 596

Use @typescript-eslint/no-unused-vars-experimental and turn off @typescript-eslint/no-unused-vars.

The issue is resolved in the latter version (experimental).

Sample config:

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

Upvotes: 20

Related Questions