Prettier

Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.

Prettier Official Docs

Installation

Install the Prettier configuration using the ServerCN CLI:

npx servercn-cli add tooling prettier

Configuration

The component installs a .prettierrc file and a .prettierignore file with sensible defaults for backend development.

.prettierrc
{
  "singleQuote": false,
  "semi": true,
  "tabWidth": 2,
  "trailingComma": "none",
  "bracketSameLine": true,
  "arrowParens": "avoid",
  "endOfLine": "lf"
}

Scripts

Add the following scripts to your package.json:

{
  "scripts": {
    "format:check": "npx prettier . --check",
    "format:fix": "npx prettier . --write"
  }
}

Why use Prettier?

  • Consistent Style: No more debates about tabs vs spaces or semi-colons.
  • Save Time: Automatically formats on save or via CLI.
  • Easy Integration: Works perfectly with ESLint and most IDEs.
  • Readable Code: Ensures everyone on the team reads the same code structure.

Add More Tooling

npx servercn-cli add tooling commitlint husky eslint prettier lint-staged typescript 

Installation

npx servercn-cli add tooling prettier