Kostenlos · Entwicklung
Code-Formatierer (Prettier).
JavaScript, TypeScript, JSX, JSON, CSS, SCSS, Less, HTML, Vue, Markdown, YAML und GraphQL mit Prettier im Browser formatieren, mit Live-Vorschau.
Formatting engine: Prettier 3 (MIT), running in your browser. Formatting changes layout only, never what the code does; comments are kept.
Code mit Prettier formatieren
- Fügen Sie Ihren Code unter
Your codeein oder klicken Sie aufOpen a file. - Behalten Sie
Detect automaticallyoder wählen Sie die Sprache: JavaScript, JSX, TypeScript, JSON, CSS, SCSS, Less, HTML, Vue, Markdown, YAML oder GraphQL. - Stellen Sie Zeilenbreite und Einrückung ein, für JavaScript und TypeScript auch Semikolons, Anführungszeichen und abschließende Kommas. Das Ergebnis aktualisiert sich beim Tippen.
- Klicken Sie auf
Copy result,DownloadoderReplace my code.
Beispiel: const a={b:1,c:[1,2,3]};function f(x){return x*2} wird zu einem Objekt in einer Zeile, gefolgt von einem mit zwei Leerzeichen eingerückten Funktionsblock; jede Anweisung endet mit einem Semikolon.
Was die Formatierung ändert
Prettier schreibt Leerzeichen, Zeilenumbrüche, Einrückung, Anführungszeichen und Kommas neu, damit der Code einem einheitlichen Stil folgt. Was der Code tut, ändert sich nie, Kommentare bleiben erhalten. Bei einem Syntaxfehler wird nichts formatiert, und die Meldung nennt Zeile und Spalte, zum Beispiel (1:10).
Für eine Sprache mit eigenen Optionen gibt es den JSON-Formatierer und den SQL-Formatierer; JavaScript für die Produktion verkleinert der JavaScript-Minifier.
Grenzen und unterstützte Formate
Ihre Eingaben werden auf Ihrem Gerät verarbeitet.
Technische Hinweise auf Englisch
Files up to 2 MB. Code with syntax errors is not formatted; the error shows the line and column. Formatting changes layout only, never behaviour; comments are kept.
Uses Prettier 3 standalone (MIT) with only the parsers the chosen language needs, loaded on demand in your browser. Same output rules as Prettier on the command line for the options shown.
const a={b:1,c:[1,2,3]};function f(x){return x*2} becomes const a = { b: 1, c: [1, 2, 3] }; followed by a function block indented with two spaces.
Häufige Fragen
Wird mein Code hochgeladen?
Nein. Prettier läuft in Ihrem Browser, und nur die Parser der gewählten Sprache werden geladen.
Ist das Ergebnis dasselbe wie Prettier auf meinem Computer?
Ja, für die hier gezeigten Optionen: Es ist Prettier 3 selbst, ohne Projekt-Konfigurationsdatei.
Warum wird mein Code nicht formatiert?
Der Parser hat einen Syntaxfehler gefunden. Korrigieren Sie die genannte Zeile und Spalte oder prüfen Sie, ob die richtige Sprache gewählt ist.