Generator .prettierrc

Spójne formatowanie kodu w projekcie

Bezpieczne (SSL)

Przetwarzanie Lokalne

100% Darmowe

Przejdź do narzędzia

Instrukcja

1

Wprowadź dane
Wpisz treść, wklej tekst lub załaduj plik z dysku.
2

Kliknij przycisk
Narzędzie natychmiast przetworzy Twoje dane w przeglądarce.
3

Pobierz wynik
Skopiuj gotowy tekst lub zapisz plik na urządzeniu.

                                                function runTool() {

                                                  return "Wynik gotowy w 0.1s";

                                                }

Konfiguracja Prettier

Szerokość tabulacji

Szerokość wiersza

Koniec linii

Quote props

Prose wrap

HTML whitespace

Używaj tabulatorów

Pojedyncze cudzysłowy w JSX

Trailing comma

Nawiasy funkcji strzałkowych

Średniki

Pojedyncze cudzysłowy

Spacje w nawiasach obiektów

Ustaw preferencje formatowania i wygeneruj config Prettier.

Oceń to narzędzie:

Powiązane narzędzia

Inne narzędzia, które mogą Ci się przydać

Generator konfiguracji Prettier

Prettier automatycznie formatuje kod, kończąc spory o styl. Konfiguracja w pliku .prettierrc lub sekcji prettier w package.json ujednolica projekt.

Najważniejsze opcje

Opcja	Znaczenie
semi	średniki na końcu instrukcji
singleQuote	pojedyncze cudzysłowy zamiast podwójnych
tabWidth	liczba spacji wcięcia
printWidth	docelowa szerokość wiersza
trailingComma	przecinki po ostatnim elemencie
arrowParens	nawiasy wokół parametru funkcji strzałkowej

Jak używać?

Zapisz zawartość jako .prettierrc w katalogu głównym projektu. Uruchamiaj npx prettier --write ., a w edytorze włącz formatowanie przy zapisie.

Prettier i ESLint

Aby narzędzia się nie kłóciły, do konfiguracji ESLint dodaj eslint-config-prettier — wyłącza on reguły ESLint dotyczące formatowania.

Najczęstsze pytania

Czy konfiguracja nadpisuje ustawienia edytora?

Nie — to plik projektu. Edytor stosuje go, gdy znajdzie go w katalogu roboczym, co zapewnia spójność w zespole.

Co wybrać: es5 czy all w trailingComma?

all działa w nowszych środowiskach (ES2017+, TypeScript). es5 jest bezpieczniejsze dla starszego kodu.

Czy Prettier zmienia logikę kodu?

Nie — formatuje wyłącznie układ. Nie naprawia błędów ani nie zmienia działania programu.

Zobacz też — powiązane narzędzia