JavaScript Formatter
Format messy or minified JavaScript with this JavaScript Formatter. Paste your code and the tool parses it as an ES module, then prints it again with two space indentation, one statement per line, consistent spacing around operators and semicolons at the end of statements, keeping your comments. Syntax errors are reported instead of guessed, so developers get readable, valid code back for reviews, debugging and documentation.
Frequently asked questions
How does the JavaScript Formatter work?
It parses your code into a syntax tree as an ES module and prints the tree again in a consistent style. Because the code is parsed rather than patched with text rules, the structure of the output always matches the input.
What style does the output use?
Blocks are indented with two spaces, each statement goes on its own line, operators get spaces around them and statements end with semicolons. Short object and array literals stay on one line, and string quotes and template literals are kept as written.
Can I change the indentation or other settings?
No, the formatter has no options. Every input is printed in the same style, which keeps results predictable when you share them.
What happens when my code has a syntax error?
The tool stops and shows the parser message, such as Unexpected: followed by the offending token. Fix the reported problem and run the formatter again.
Are comments preserved?
Yes, line comments and block comments are kept and placed with the statements they belong to. A comment inside a statement may move to the start of the following statement.
Does it support modern JavaScript?
Yes, the parser understands modern syntax such as import and export, arrow functions, classes, async and await, destructuring, spread, optional chaining, nullish coalescing and template literals. Longer object literals that do not fit on one line are split with one property per line.
Can I format minified code?
Yes, minified files are parsed and spread over readable lines and indentation. Short variable names chosen by the minifier are kept, since formatting never renames anything.
Will formatting change what my code does?
No, it only changes whitespace, line breaks and statement terminators. The only additions are semicolons, which match how JavaScript already reads the code.
Why is the result wrapped in a javascript code fence?
The result is returned as a Markdown code block that starts with a javascript fence, so it renders with highlighting when pasted into Markdown. Copy the lines between the fences when you want the plain source.
What about JSX, TypeScript or Flow?
This page handles plain JavaScript. Use the JSX Formatter for React components, and the TypeScript or Flow Formatter for typed code, because type annotations are not part of standard JavaScript.