Weboldal keresés

reactjs - Hogyan lehet a VScode-ban a Prettier automatikus formázót úgy beállítani, hogy ne távolítsa el a vesszőket a TypeScript típusokból, miután hozzáadtam a Reactet


Amikor mentek egy fájlt az automatikus formázó bekapcsolva, a típus

type Params = {
  fileName: string,
  isTxt: boolean
}

mentve lesz mint

type Params = {
  fileName: string
  isTxt: boolean
}

Amit a React már nem fogad el. A Prettier csak akkor kezdte el törölni a vesszőket, amikor hozzáadtam a Reactet a projekthez. Hogyan tudom megakadályozni, hogy a Prettier ezt tegye?

A VScode 1.62.3-ban a Prettier bővítményt v9.0.0 és a Typescriptet v4.5.2 verzióban használom.

.prettierrc használata

{
  "semi": false,
  "trailingComma": "none",
  "singleQuote": true,
  "printWidth": 80
}

Válasz #1

Beállíthatod a trailingComma értékét all-ra

Válasz #2

Nem vagyok biztos benne, hogy ennek a React-hez kellene kapcsolódnia. De az általam végzett teszt alapján egy nem-React projektben a Prettier ugyanúgy formázza a .ts és .tsx fájlokat, amikor explicit módon semi-t false-ra állítod, ahogy te tetted.

type Params = {
  fileName: string
  isTxt: boolean
}

És amikor a semi true értékű:

type Params = {
  fileName: string;
  isTxt: boolean;
}

Jelenleg (2023) mindkettő érvényes TypeScript. Akárhogy is, semmilyen vessző nem marad. Ez a véleményvezérelt eredmény a Prettier programból. Meg lett vitatva, megváltoztatva és újra meg lett vitatva. Ez a Prettier probléma a GitHubon nagyjából összefoglalja a helyzetet.

Alternatíva

Ha valóban meg akarod tartani a vesszőket, lehet, hogy másik kiegészítőt kell keresned. A Beautify lehet egy másik kulcsszó a kereséshez, de vigyázz, a pontos nevű kiegészítő már jó ideje elavult.

  • Beautify (9,8 M letöltés, elavult)

Kérjük, győződjön meg róla, hogy alaposan teszteli, mielőtt használatba venné.