ESLint - Konfigurácia "no-unused-vars" pre TypeScript

Všetky svoje projekty v TypeScripte používam s ESLint s nasledujúcimi nastaveniami:

  "extends": ["airbnb", "prettier", 'plugin:vue/recommended'],
  "plugins": ["prettier"],
  "parserOptions": {
  "parser": "@typescript-eslint/parser",
  "ecmaVersion": 2018,
  "sourceType": "module"
  },

kopa vlastných pravidiel. Tiež som nainštaloval nasledujúce závislosti pre podporu TypeScript:
```
  "@typescript-eslint/eslint-plugin": "^1.7.0",
  "@typescript-eslint/parser": "^1.7.0",
```

Avšak jedno z najpraktickejších pravidiel ESLint, https://eslint.org/docs/rules/no-unused-vars, sa zdá byť veľmi zle nakonfigurované pre projekty v TypeScripte. Napríklad keď exportujem enum, pravidlo ma upozorní, že enum sa v súbore, kde je deklarovaný, nepoužíva:

export enum Foo {
   Bar,
}

Rovnako, keď importujem rozhranie alebo triedu, aby sa používala ako typ, 'no-unused-vars' sa opäť sťažuje na riadku samotného importu:

V Foo.ts

export interface Foo {
   bar: string;
}

V bar.ts

import { Foo } from './Foo'
const bar: Foo = { bar: 'Hello' };

Existuje nejaký spôsob, ako nakonfigurovať pravidlo no-unused-vars tak, aby zohľadňovalo tieto dva prípady? Nie som priaznivcom jeho vypnutia, pretože je to jedno z najužitočnejších pravidiel v celom mojom sade pravidiel okrem týchto prípadov.

Už som pravidlo znížil tak, aby dávalo len upozornenie namiesto chyby, ale mať všetky moje dokumenty plné upozornení stále akosi znevýhodňuje účel používania esLint.

Vyplnenie všetkých mojich dokumentov pomocou //eslint-disable-line, ako sa tu navrhuje, sa tiež zdá ako zlé riešenie.

Odpoveď č. 1

Myslím, že použitie "plugin:@typescript-eslint/eslint-recommended" zavádza množstvo nežiaducich pravidiel. Asi je lepšie použiť ESLint pravidlo "@typescript-eslint/no-unused-vars".

{
  "parser": "@typescript-eslint/parser",
  "plugins": [
    "@typescript-eslint",
  ],
  "extends": [
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended",
  ],
  "rules": {
    "no-unused-vars": "off",
    "@typescript-eslint/no-unused-vars": ["error"]
  }
}

Poznámka: po vykonaní vyššie uvedenej zmeny nezabudnite reštartovať váš server.

Referencia - https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-unused-vars.md

Odpoveď č. 2

Je to trochu ukryté v dokumentácii, ale ak pridáte niektoré veci do vlastnosti 'extends', môžete používať pravidlá odporúčané ESLintom, ako napríklad no-unused-vars, a zároveň to skutočne funguje v TypeScripte. Takto:

"extends": [
        "eslint:recommended",
        "plugin:@typescript-eslint/eslint-recommended",
        "plugin:@typescript-eslint/recommended"
    ],

@typescript-eslint/recommended sa zdá byť tým, čo umožňuje eslint:recommended efektívne pracovať s konštruktmi Typescriptu. Nie som si však istý, ako by to ovplyvnilo tvoje ostatné rozšírenia.

Odpoveď č. 3

Dostal som veľa falošných chýb s najnovšími verziami TypeScript/ES-Lint a zistil som, že prišli s experimentálnym pravidlom na opravu no-unused-vars, ktoré je rozbité, a s experimentálnym pravidlom @typescript-eslint/no-unused-vars-experimental to konečne funguje tak, ako očakávam.

Pred zmenou na mojej strane som mal viaceré falošné chyby pri používaní rozhraní/typov, ktoré hovorili, že tieto premenné sa nepoužívajú (čo samozrejme nikdy nebudú, pretože nie sú premennými, ale rozhraniami/typmi)... a ak vás zaujíma samotný kód, tu je PR pridávajúci toto experimentálne pravidlo, a tak som to pravidlo našiel.

Tu je podmnožina môjho aktualizovaného súboru .eslintrc

{
  "parser": "@typescript-eslint/parser",
  "extends": [
    "plugin:@typescript-eslint/recommended"
  ],
  "rules": {
    "@typescript-eslint/no-unused-vars": "off",
    "@typescript-eslint/no-unused-vars-experimental": "error",
    "no-unused-vars": "off"
  }
}

a ja som teraz konečne späť v normále :)

ÚPRAVA (jan. 2021)

Ako spomenul Brad (správca projektu) v komentári nižšie, toto je (bolo) dočasné riešenie a teraz je zastarané. Z jeho komentára (nižšie) teraz môžeme priamo použiť @typescript-eslint/no-unused-vars pre rovnaké zamýšľané správanie. Vďaka Bradovi za informáciu. Môžem tiež potvrdiť, že prechod späť na @typescript-eslint/no-unused-vars teraz u mňa funguje (aktualizoval som svoj kód a teraz je všetko v poriadku).

Toto nie je správna cesta a mali by ste sa jej vyhnúť. @typescript-eslint/no-unused-vars-experimental je zastarané a bude odstránené v ďalšej hlavnej verzii. Aktualizujte na najnovšiu verziu nástrojov a jednoducho používajte @typescript-eslint/no-unused-vars. Zdroj: Som správca projektu.

Takže tu je najnovšia aktualizácia môjho súboru .eslintrc, ktorá u mňa funguje :)

{
  "parser": "@typescript-eslint/parser",
  "extends": [
    "plugin:@typescript-eslint/recommended"
  ],
  "rules": {
    "@typescript-eslint/no-unused-vars": "error",
    "no-unused-vars": "off"
  }
}

Odpoveď č. 4

Mojím problémom bolo používanie dekorátorov a túžba mať premennú s vhodným názvom kvôli prehľadnosti, napríklad:

@OneToMany((type) => Employee) namiesto @OneToMany(() => Employee)

Bežným riešením pre TypeScript je predpona s podčiarkovníkom:

@OneToMany((_type) => Employee)

A je možné, aby ESLint prijímal to isté:

.eslintrc.js

module.exports = {
  ...
  rules: {
    '@typescript-eslint/no-unused-vars': ['warn', { 'argsIgnorePattern': '^_' }]
    ....
  },
};

Odpoveď č. 5

Pre kohokoľvek, kto chce, aby vo TypeScripte správne fungovala kontrola `no-unused-vars` pri používaní YAML konfigurácie, napr. .eslintrc.yaml, vyzerá to takto: