nextjs-fetch-data-example/ai/nextjs-style-guide/applied/biome.md

---
title: Biome
description: Установка и настройка линтера-форматтера в новом проекте.
keywords: [biome, линтер, форматтер, lint, format, biome.json, "@biomejs/biome", замена eslint, замена prettier]
---

# Biome

Установка и настройка линтера-форматтера в новом проекте.

## Требования

- Node.js 18+.
- Проект без установленного ESLint и Prettier (они конфликтуют с Biome).

## Установка

1. Установить пакет:

   ```bash
   npm install --save-dev --save-exact @biomejs/biome
   ```

2. Инициализировать конфиг:

   ```bash
   npx @biomejs/biome init
   ```

   В корне появится `biome.json` с дефолтными настройками.

3. Привести `biome.json` к стандартному виду (см. «Стандартный `biome.json`»). Делается сразу после `init`, до первого запуска `lint`/`check`.

4. Добавить скрипты в `package.json`:

   ```json
   {
     "scripts": {
       "lint": "biome lint .",
       "format": "biome format --write .",
       "check": "biome check --write ."
     }
   }
   ```

   | Скрипт | Что делает |
   |--------|-----------|
   | `lint` | Проверка правил без правок |
   | `format` | Автоформатирование всех файлов |
   | `check` | Lint + format + organize imports в один проход (основная команда) |

## Стандартный `biome.json`

Дефолтный `biome.json`, созданный `biome init`, заменяется стандартным конфигом проекта.

Стандартный `biome.json`:

```jsonc
{
  "$schema": "https://biomejs.dev/schemas/2.2.0/schema.json",
  "vcs": {
    "enabled": true,
    "clientKind": "git",
    "useIgnoreFile": true
  },
  "files": {
    "ignoreUnknown": true,
    "includes": ["**", "!node_modules", "!.next", "!dist", "!build", "!.templates", "!src/infra/**/generated"]
  },
  "formatter": {
    "enabled": true,
    "indentStyle": "space",
    "indentWidth": 2,
    "lineWidth": 120
  },
  "javascript": {
    "formatter": {
      "quoteStyle": "single",
      "jsxQuoteStyle": "double"
    }
  },
  "linter": {
    "enabled": true,
    "rules": {
      "recommended": true,
      "suspicious": {
        "noUnknownAtRules": "off"
      },
      "correctness": {
        "noUnknownMediaFeatureName": "off"
      }
    },
    "domains": {
      "next": "recommended",
      "react": "recommended"
    }
  },
  "assist": {
    "actions": {
      "source": {
        "organizeImports": "on"
      }
    }
  }
}
```

`src/infra/**/generated` исключается из Biome, потому что generated-файлы не правятся руками. При этом generated-файлы остаются в git.

Правила `suspicious/noUnknownAtRules` и `correctness/noUnknownMediaFeatureName` отключены, потому что проектный CSS-стек использует `@custom-media` и другие конструкции, которые Biome может не распознавать.

## Интеграция с VS Code

Расширение `biomejs.biome` и автоформатирование при сохранении настраиваются в [VS Code](./vscode.md).