Prettier

ELI5 — The Vibe Check

Prettier is an opinionated code formatter that automatically reformats your code to look consistent. Single quotes or double quotes? 2 spaces or 4? Prettier decides and applies it everywhere, ending pointless style debates in teams. It doesn't care about bugs (that's ESLint's job) — just formatting.

Real Talk

Prettier is an opinionated code formatter that enforces a consistent style by parsing code and reprinting it with its own rules, ignoring original formatting. It supports JavaScript, TypeScript, CSS, HTML, JSON, Markdown, and more. The key distinction from ESLint: Prettier handles formatting, ESLint handles code quality and bugs.

Show Me The Code

// .prettierrc
{
  "semi": false,
  "singleQuote": true,
  "tabWidth": 2,
  "trailingComma": "es5",
  "printWidth": 80
}

// Before Prettier
const x={name:"Alice",age:30}

// After Prettier
const x = { name: 'Alice', age: 30 }

When You'll Hear This

Configure your editor to format on save with Prettier.,Prettier eliminates all formatting debates in code review.,Use eslint-config-prettier to turn off ESLint rules that conflict with Prettier.