How to Format JavaScript in Sublime Text, Atom, and WebStorm

Automatic formatting isn't exclusive to VS Code. Here's how to set it up in three other popular editors.

Sublime Text

Install Package Control if you haven't already, then use it to install the "JsPrettier" package. Once installed, open Package Settings → JsPrettier and point it at a local Node.js and Prettier installation in your project (JsPrettier shells out to your project's own Prettier binary rather than bundling one). You can then trigger formatting with a keyboard shortcut, or configure "format on save" in the package settings.

Atom

Search Atom's package manager for prettier-atom and install it. It works out of the box with a bundled copy of Prettier, or will use your project's local installation if one exists (recommended, so formatting matches what runs in CI). Enable "Format On Save" in the package settings to apply it automatically.

Note: Atom itself has been sunset by GitHub in favor of VS Code, so if you're starting a new setup today, migrating is worth considering — see our VS Code setup guide.

WebStorm (and other JetBrains IDEs)

WebStorm has first-class Prettier support built in — no plugin required. Go to Settings/Preferences → Languages & Frameworks → JavaScript → Prettier, point it at your project's Prettier package, and check "On save" and/or "On code reformat" to run it automatically. WebStorm will also respect a .prettierrc file in your project automatically.

What all three approaches have in common

In every editor, the underlying formatter is the same — Prettier — which means the actual output is identical regardless of which editor your team uses. This is one of Prettier's biggest practical advantages: a designer using Sublime, a backend developer in WebStorm, and a frontend developer in VS Code can all commit code that looks exactly the same.

No editor plugin yet?

While you're getting a project-level setup in place, you can format code immediately using the JS formatter on this site — it applies the same Prettier rules directly in your browser, with no installation. For the VS Code-specific walkthrough, see how to set up Prettier in VS Code.