Nuxt2 min read
Prettier + EditorConfig pre Nuxt/Vue
Jednotné formátovanie `.vue`, `.ts` a markdown súborov.
Formátovanie sa nemá riešiť na review. Prettier + EditorConfig odstránia zbytočné diskusie a diff šum.
Oficiálne zdroje:
Čo si z článku odnesieš
- ako zladiť Prettier a EditorConfig bez konfliktov
- ako nastaviť jednotné formátovanie v tíme
- prečo formátovanie oddeliť od logických pravidiel ESLintu
Praktický postup
- Nastav jednu spoločnú konfiguráciu a commitni ju do rootu repozitára.
- V editore zapni format on save pre všetkých členov tímu.
- Nechaj Prettier riešiť formát, ESLint logiku a rizikové vzory.
- Pri existujúcom projekte urob jednorazový „format commit“ samostatne.
Príklad z praxe
# .editorconfig
[*]
charset = utf-8
indent_style = space
indent_size = 2
insert_final_newline = true
# .prettierrc
{
"semi": true,
"singleQuote": true,
"printWidth": 100
}Ako overíš, že je to správne
- Spusť
npm run lintaj po automatickom formátovaní. - Skontroluj diff: nemá obsahovať náhodné whitespace zmeny.
- Over, že CI používa rovnakú verziu formattera.
Najčastejšie chyby
- miešanie viacerých formatterov naraz,
- rozdielne editor nastavenia medzi členmi tímu,
- formátovacie zmeny zabalené do funkčných PR.
Mini úloha
- Sprav samostatný format commit bez funkčných zmien.
- Nastav format on save a over na dvoch súboroch.
- Doplň do CONTRIBUTING pravidlo pre formátovanie.
Čo bude ďalej
V ďalšom článku: Husky + lint-staged pred commitom.