JavaScript & TypeScript Beautifier

Format JS, TS, JSX and TSX with Prettier, and minify JavaScript with Terser.

Runs locally · nothing uploaded
Input
Output 
What it does
Paste minified or simply inconsistent code and get it back formatted the way Prettier would format it in your editor. Switch to Minify to compress plain JavaScript with Terser. The output updates as you type.
Features
  • JavaScript, TypeScript, JSX and TSX, including modern syntax: optional chaining, decorators, generics, satisfies, import type and React components.
  • The Prettier options developers actually change: 2 spaces, 4 spaces or tabs, print width, single or double quotes, semicolons on or off and trailing commas (all, ES5 or none).
  • Minify with Terser: name mangling and compression can be switched separately, /*! ... */ and @license comments are kept, and ES modules (import / export) are detected automatically.
  • Precise syntax errors with the line and column, a code snippet with a caret and a Go to error button. If TypeScript is pasted while JS is selected, the tool says so.
  • Size before and after, line counts and timing. Opening a .ts, .tsx or .jsx file selects the language automatically.
How to use it
  1. Paste code, open a file or drop one onto the input. Example loads a sample for the selected language.
  2. Pick the language, then Format or Minify.
  3. Copy or download the result. Ctrl+Enter runs immediately.
Minify works on plain JavaScript only. Terser has no TypeScript or JSX parser, and there is no browser build that minifies TypeScript directly, so TS, JSX and TSX have to be compiled to JavaScript first (for example with tsc, esbuild or Babel). They can always be beautified here. The TypeScript parser is downloaded only when you choose TS or TSX, and Terser only when you first minify.
Privacy
Your code is formatted and minified in your browser; only the pinned Prettier and Terser files are downloaded from a CDN. Nothing is uploaded. The last input is kept in local storage so a refresh doesn’t lose it.