ESLint extends vs plugins v2020

Question

Il y a répondu question qui à mon avis ne répond pas vraiment à la question, sur la différence entre extends: [] vs plugins: [] dans ESLint.

Dans mon cas, j'ai juste utilisé la section des extensions :

extends: [
  'plugin:@typescript-eslint/recommended',
],
plugins: [],
rules: {
  '@typescript-eslint/explicit-function-return-type': [
    'error',
    {
      allowExpressions: true,
    },
  ],
}

Comme vous pouvez le voir, j'ai juste utilisé une configuration prédéfinie à partir de plugin:@typescript-eslint/recommended et également écrasé @typescript-eslint/explicit-function-return-type la règle en rules: {} section. Mais pourquoi avons-nous besoin de cette section PLUGINS alors ? Si tout fonctionne sans elle ? Qu'est-ce qui me manque ?

Answer 1

Vous l'avez fait correctement.

Pour votre exemple, il y a 2 façons de faire l'addition typescript-eslint ...

• 1ère voie :

  { parser: "@typescript-eslint/parser", parserOptions: { sourceType: "module" }, plugins: ["@typescript-eslint"], extends: [], rules: { "@typescript-eslint/explicit-function-return-type": [ "error", { allowExpressions: true } ] } }

• 2ème voie :

  { plugins: [], extends: ["plugin:@typescript-eslint/recommended"], rules: { "@typescript-eslint/explicit-function-return-type": [ "error", { allowExpressions: true } ] } }

La différence est...

• 1ère voie :
  • parser , parserOptions y plugins sont ajoutés manuellement,
  • Seulement @typescript-eslint/explicit-function-return-type est appliquée.
• 2ème voie :
  • plugin:@typescript-eslint/recommended a automatiquement ajouté parser , parserOptions y plugins .
  • Les règles typographiques recommandées sont ajoutées et appliquées.
  • @typescript-eslint/explicit-function-return-type est augmentée et appliquée.

C'est pourquoi lorsque vous utilisez plugin:@typescript-eslint/recommended les choses fonctionnent normalement même si plugins est vide. Un plugin/configs bien écrit permet cela.