Code Formatter (Prettier) — Kodformaterare

Vad den här kodformateraren gör

Det här verktyget kör Prettier, den åsiktsstarka kodformaterare som används i stora delar av JavaScript-ekosystemet, direkt i din webbläsare. Prettier gör inte bara om indraget på raderna: den tolkar din källkod till ett syntaxträd och skriver ut det på nytt från grunden enligt ett litet antal regler. Därför blir resultatet enhetligt oavsett hur rörig indatan var – långa argumentlistor radbryts, objekt delas upp på flera rader först när de överskrider radbredden, citattecken och semikolon följer en och samma konvention och avslutande blanksteg försvinner.

Du kan formatera JavaScript, JSX, TypeScript och TSX, de tre vanligaste stilmallsdialekterna (CSS, SCSS och Less), HTML med inbäddade stilar och skript, JSON, GraphQL-scheman och -frågor, Markdown-dokument och YAML-konfigurationsfiler. Varje språk använder sitt eget Prettier-plugin, och bara det plugin du behöver laddas, så sidan förblir lätt tills du faktiskt formaterar något.

Alternativen förklarade

Print width (radbredd) är den radlängd som Prettier försöker hålla sig under; 80 är standard, och 100 eller 120 är vanligt i team med breda skärmar. Tab width anger hur många blanksteg en indragsnivå motsvarar, och Indent with växlar mellan blanksteg och riktiga tabbtecken. Semicolons styr om satser i JavaScript och TypeScript avslutas med semikolon; när alternativet är avstängt lägger Prettier bara till ett där det krävs för att undvika tvetydighet. Single quotes föredrar ' framför " för strängar när det inte kräver extra escape-tecken. Alternativen motsvarar exakt inställningarna i en .prettierrc-fil, så att du kan spegla ditt projekts konfiguration.

Privat och praktiskt

Allt sker lokalt: formateraren laddar aldrig upp din kod, sparar den inte och skickar den inte till något API. Det gör den säker för proprietär källkod, konfigurationsfiler med interna värdnamn eller kodsnuttar som kopierats under en produktionsincident. När parsern hittar ett syntaxfel visar meddelandet rad och kolumn, och markören hoppar till just den platsen i indatan – ett snabbt sätt att hitta en saknad parentes i en stor JSON- eller YAML-fil. I det dagliga arbetet hör Prettier hemma i din editor och din CI; använd den här sidan när du sitter vid en dator utan dina verktyg, granskar en kodsnutt från chatten eller vill städa upp kod innan du klistrar in den i dokumentation.