How to beautify and reindent JavaScript
Beautifying JavaScript takes minified, single-line code and expands it so that blocks are indented and statements sit on their own lines. It is the standard first step when you are trying to understand what a compiled bundle is doing.
The formatter runs in your browser. It reindents by tracking braces and semicolons while leaving the contents of strings and template literals alone, and it does not preserve comments, so it belongs on compiled output rather than on source you maintain.
- Paste the minified JavaScript into the input box.
- Read the expanded output, indented two spaces per nesting level.
- Copy it into an editor with syntax highlighting to trace the logic.
- Expect single-letter variable names to remain, since a beautifier cannot undo the renaming a minifier applied.
- Check whether the bundle ships a source map first, because that will give you the real source with real names and comments.