Prettier — Code Formatting

Prettier takes your code and reprints it from scratch according to a fixed set of rules. It parses your source into an AST, discards all original formatting, and outputs a consistently styled version. The result is that every developer on the team produces identically formatted code regardless of their editor or personal preferences.

This skill covers configuring Prettier, integrating it with ESLint, setting up editor support, and enforcing formatting in CI.

Installing and Configuring Prettier

Prettier works with zero configuration, but most teams customize a few options to match their preferences.

# Install Prettier as a dev dependency
npm install --save-dev prettier

Create a configuration file at the project root. Prettier supports several formats — .prettierrc.json is the most common.

// .prettierrc.json — Prettier configuration for a TypeScript project