Werkzeuge

JavaScript-Beautifier

Rücken Sie minifiziertes oder unordentliches JavaScript und JSON mit js-beautify neu ein – mit wählbarer Einrückungsbreite und wählbarem Klammerstil.

Läuft im BrowserCode-Konverter8996
Kostenlos

Eingabe

0 B

Ergebnis

Das Ergebnis erscheint hier.

Ein minifiziertes Bundle, ein einzeiliger Schnipsel aus einem Bug-Report, ein aus den DevTools kopiertes Skript: Lesbares JavaScript ist bei allen der erste Schritt zum Verständnis. Hier läuft js-beautify, der Formatierer hinter beautifier.io und einer langen Liste von Editor-Plugins, der Code Token für Token neu einrückt, ohne das ganze Programm verstehen zu müssen. Deshalb kommt er mit Fragmenten und sogar leicht fehlerhaftem Code zurecht, den ein vollständiger Parser ablehnen würde, und formatiert JSON genauso gut wie JavaScript.

So arbeitet es

  • Die Klammerstile entsprechen denen von js-beautify: gleiche Zeile, gleiche Zeile mit kurzen Blöcken inline, jede Klammer in einer eigenen Zeile (Allman) oder else und catch in eine neue Zeile verschoben.
  • Leerzeilen, die Sie zwischen Blöcken gelassen haben, bleiben erhalten, mehrere hintereinander werden zu einer zusammengefasst – es sei denn, Sie schalten das aus.
  • Das Formatieren stellt das Layout wieder her, nicht die Namen: Eine minifizierte Variable namens e bleibt e.
  • Die Eingabe wird nicht validiert, ein Syntaxfehler wird also mitformatiert statt gemeldet.

Wohin Ihre Daten gehen

Nirgendwohin. Dieses Werkzeug läuft vollständig in Ihrem Browser: Der eingefügte Text wird von der Seite verarbeitet und weder an einen Server übertragen noch protokolliert.

Dieses Tool ist kostenlos und braucht kein Konto. Die Ergebnisse existieren nur in Ihrer geöffneten Seite und werden nirgends gespeichert.

Was es kostet

Dieses Werkzeug ist kostenlos, ohne Anmeldung und ohne Punkte.

Häufige Fragen

Kann es minifizierten Produktionscode wieder in das Original verwandeln?
Nur das Layout. Minifier benennen lokale Variablen um und löschen Kommentare, und diese Information ist in der Datei schlicht nicht mehr vorhanden. Liefert die Website Source Maps aus, können die DevTools Ihres Browsers den minifizierten Code auf die ursprünglichen Quellen abbilden – der einzige echte Weg, die Namen zurückzubekommen.
js-beautify oder Prettier?
Prettier gibt Code aus einem vollständigen Parse neu aus und erzwingt einen einheitlichen Hausstil – das ist es, was Sie in einem Repository wollen. js-beautify passt nur Leerraum und Einrückung an und eignet sich deshalb besser, um schnell Code zu lesen, den Sie nicht committen werden, einschließlich Fragmenten, die Prettier nicht parsen würde.
Kommt es mit TypeScript oder JSX zurecht?
Nicht zuverlässig. js-beautify versteht JavaScript und behandelt viel TypeScript mehr oder weniger zufällig richtig, aber Typannotationen, Generics und JSX-Tags können seltsam eingerückt herauskommen. Prettier parst beides korrekt und ist dafür das bessere Werkzeug.

Das Open Source dahinter

Dieses Werkzeug läuft auf beautifier/js-beautify, veröffentlicht unter MIT. Wer dasselbe Verhalten im eigenen Programm braucht, greift zu dieser Bibliothek.

beautifier/js-beautify

Auch bekannt als

  • JavaScript Beautifier
  • JS beautify online
  • JavaScript unminify
  • JavaScript formatieren online
  • JS Code formatieren
  • JavaScript Pretty Print