# ESLint and Prettier are configured

- **Pattern:** `ab-000671` (`code-maintainability.naming-conventions.eslint-prettier`)
- **Severity:** medium
- **Lifecycle:** active
- **Last modified:** 2026-04-18
- **Canonical URL:** https://auditbuffet.com/patterns/ab-000671
- **License:** CC-BY-4.0 — attribute to AuditBuffet Pattern Catalog (https://auditbuffet.com/patterns/ab-000671)

## Why it matters

Without ESLint and Prettier, code style diverges with every commit. Reviewers spend time on formatting comments instead of logic. Style inconsistencies accumulate until they generate real merge conflicts. ISO 25010 maintainability.analysability and modifiability both degrade as the codebase becomes harder to read and predict. Projects bootstrapped with `create-next-app` get a default ESLint config that is never customized — it provides minimal coverage and gives a false impression that linting is configured.

## Severity rationale

Medium because absent linting and formatting tools allow consistent, preventable code quality issues to accumulate that slow every code review and future refactoring.

## Remediation

Install and configure both tools:

```bash
npm install -D eslint prettier eslint-config-prettier
npx eslint --init
echo '{}' > .prettierrc
```

For Next.js, extend the built-in config and add the Prettier integration:

```json
// .eslintrc.json
{
  "extends": ["next/core-web-vitals", "prettier"]
}
```

Add `lint` and `format` scripts to `package.json`. Pair with git pre-commit hooks (see the git-hooks check) so neither tool is optional.

## Detection

- **ID:** `eslint-prettier`
- **Severity:** `medium`
- **What to look for:** Check for ESLint configuration: `.eslintrc.js`, `.eslintrc.json`, `.eslintrc.yaml`, `eslint.config.js` (flat config), or an `eslintConfig` key in `package.json`. Check for Prettier configuration: `.prettierrc`, `.prettierrc.json`, `.prettierrc.js`, `prettier.config.js`, or a `prettier` key in `package.json`. Also check that ESLint and Prettier appear in `devDependencies`. Note: some frameworks (Next.js) include ESLint by default — verify it's actually configured, not just installed.
- **Pass criteria:** Count all linting and formatting configuration files in the project. Both ESLint and Prettier (or a unified formatter like Biome) are installed and have configuration files present. The ESLint config references at least 1 installed rules/plugins. Extract and quote the extends or plugins array from the ESLint config to verify it is not empty. Report which tools are configured even on pass.
- **Fail criteria:** Either ESLint or Prettier (or both) is absent or not configured. A project with `eslint` installed but no config file does not pass. Do NOT pass when a config file exists but is empty or contains no rules.
- **Cross-reference:** For git hooks that enforce linting before commit, see the git-hooks check in this audit.
- **Skip (N/A) when:** The project uses a non-JavaScript/TypeScript language that has its own equivalent tooling (e.g., `gofmt` for Go, `rustfmt` for Rust, `black` for Python) — evaluate that tooling instead. Signal: no `package.json` in the project.
- **Detail on fail:** `"No Prettier configuration found (.prettierrc or prettier.config.js absent, no prettier key in package.json). ESLint installed but config file is missing — likely the Next.js default that was never customized."` or `"Neither ESLint nor Prettier configured — no linting or formatting tooling set up."`
- **Remediation:** Without automated linting and formatting, code style diverges rapidly across files and contributors. Code review time increases because reviewers must manually check what tools would catch automatically.

  Set up ESLint and Prettier:
  ```bash
  npm install -D eslint prettier eslint-config-prettier
  npx eslint --init  # interactive setup
  echo '{}' > .prettierrc  # minimal config, uses defaults
  ```

  For Next.js, extend the built-in config:
  ```json
  // .eslintrc.json
  {
    "extends": ["next/core-web-vitals", "prettier"]
  }
  ```

  Add format and lint scripts to `package.json`:
  ```json
  "scripts": {
    "lint": "eslint . --ext .ts,.tsx",
    "format": "prettier --write ."
  }
  ```

---

## External references

- iso-25010 maintainability.analysability
- iso-25010 maintainability.modifiability

Taxons: code-quality

HTML version: https://auditbuffet.com/patterns/ab-000671