Formatting & Linting

ESLint is a tool that helps identify and fix problems in JavaScript and TypeScript code, ensuring code quality and consistency by enforcing coding standards and detecting potential errors.

Prettier is a code formatter that automatically organizes code based on a set of style rules, improving readability and maintaining a consistent format across the codebase.

Automatic formatting and linting fix on save

By default, Prettier and ESLint are configured to format and lint your codebase while you are developing. If you want to disable this behavior, open the .vscode/settings.json file and set the following options:

{
  "editor.formatOnSave": false,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": false
  }
}

Manual formatting

To manually check the codebase with Prettier, run:

pnpm format

To manually fix all formatting issues with Prettier, run:

pnpm format:fix

This works on a workspace-basis as well:

pnpm --filter <workspace> format
pnpm --filter <workspace> format:fix

Manual linting

To manually lint your codebase with ESLint, run:

pnpm lint

To fix all linting errors in your codebase with ESLint, run:

pnpm lint:fix

This works on a workspace-basis as well:

pnpm --filter <workspace> lint
pnpm --filter <workspace> lint:fix