16
votes

Pourquoi ESLint lance 'no-unused-vars' pour l'interface TypeScript?

Donc, j'ai ce morceau de code dans le fichier .ts:

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

Et ESLint lève cette erreur:

Erreur

J'ai cette configuration pour TypeScript dans ESLint:

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

export default class MicroEvent implements MicroEventInterface {

// code

Donc, tout semble aller bien, mais je ne peux pas vaincre cette erreur.

Aucune suggestion?

Merci!

UPD:

On dirait que je console.log( --- , MicroEventInterface); l'erreur disparaît. Je pense qu'ESLint ne traite pas les implements comme une utilisation réelle.


9 commentaires

ESLint renvoie généralement une telle erreur lorsque les modules importés n'ont pas été utilisés dans la portée de définition. Fondamentalement, il veut dire: "Pourquoi importez-vous même quelque chose alors que vous n'en avez pas besoin".


@VikasMishra ouais, je comprends cela. Mais je l'utilise en fait avec la commande «implements».


Mettre en œuvre quelque chose ne signifie pas que vous l'utilisez. Implémenter dicte simplement qu'il se conforme (peut utiliser) des modules spécifiques si nécessaire.


@VikasMishra Alors, comment puis-je résoudre ce problème? Dois-je placer mes interfaces dans le même fichier avec le composant? Est-ce que ce BP?


Ajoutez ceci au fichier de configuration ESLint {"rules": {"no-unused-vars": [2, {"vars": "local", "args": "after-used"}]}}


@VikasMishra Non, ne fonctionne pas pour moi. Voir toujours cette erreur


N'utilisez pas ESLint. Préférez TSLint.


@Paleo utilisant TSLint sur ESLint n'est pas une option valide à partir de 2019, car le projet TSLint est obsolète au profit de l'utilisation d'ESLint avec TypeScript: github.com/palantir/tslint/issues/4534


Même problème lors de l'importation d'une interface et de son utilisation comme variable ou type de retour. Par exemple, Réagit FunctionComponent. Y a-t-il une solution qui fonctionne?


5 Réponses :


-3
votes

Je pense que la bonne façon de résoudre ce problème est de déclarer votre interface.

declare interface Foo {}

dans un fichier séparé avec d'autres types, par exemple Foo.d.ts

Et après cela, configurez correctement votre compilateur dactylographié pour récupérer toutes les déclarations.

Voir:https://www.typescriptlang.org/docs/handbook/tsconfig-json.html

Section: @types, typeRoots et types

Après cela, vous pourrez utiliser toutes vos déclarations de type et interfaces sans importation explicite.


0 commentaires

1
votes

Pour résoudre ce problème dans un projet TypeScript pur, j'ai ajouté la règle suivante à mon fichier de configuration .eslintrc.json ( .eslintrc.json ). Pour que cette solution particulière fonctionne, vous devez suivre la convention selon laquelle les noms d'interface commencent par un «I» majuscule.

Incidemment, les autres artefacts (à savoir les classes) dont la première lettre est un «I» majuscule seront ignorés lors de la détermination de leur utilisation dans des fichiers / modules.

Eslint

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

Pour plus d'informations sur cette règle, consultez la documentation .


0 commentaires

15
votes

Utilisez @typescript-eslint/no-unused-vars-experimental et désactivez @typescript-eslint/no-unused-vars .

Le problème est résolu dans la dernière version (expérimentale).

Exemple de configuration:

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


1 commentaires

@ typescript-eslint / no-unused-vars-experimental est maintenant déprécié



10
votes

ajouter ceci aux règles Eslint

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


1 commentaires

github.com/eslint/eslint#configuration et eslint.org/docs/rules/no-unused-vars#args pour plus d'informations. Aussi 2 pourrait être remplacé par "erreur"



8
votes

Source: Je suis le mainteneur du projet typescript-eslint .

La dernière version de l'outil @typescript-eslint désormais entièrement en charge l'analyse de portée.

Les étapes pour résoudre ce problème sont donc les suivantes:

  • mettez à jour vos versions vers au moins v4.1.0 de @typescript-eslint/parser et @typescript-eslint/eslint-plugin
  • mettre à jour votre version ESLint au moins à la v7.5.0
  • mettez à jour votre configuration pour utiliser @typescript-eslint/no-unused-vars

Redémarrez votre IDE et vous devriez maintenant voir les erreurs de charpie correctes.


5 commentaires

et si la version ESLint est ^ 6.6.0? C'est ce qui est attendu lorsque nous créons un projet avec l'application create react.


L'ARC est en train de mettre à jour vers une version plus récente d'eslint et des plugins. Vous pouvez essayer leur prochaine version v4 en utilisant leur next tag sur NPM.


Cela a correctement résolu mon problème.


@BradZacher - pouvez-vous détailler la update your config to use @typescript-eslint/no-unused-vars ? Devrait-il ressembler à ça? "rules": { "import/first": "off", "no-unused-vars": "off", "@typescript-eslint/no-unused-vars": ["error"] }


Essayez la documentation pour plus d'informations: github.com/typescript-eslint/typescript-eslint/blob/master / ...