biome

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Biome - Fast All-in-One Toolchain

Biome - 快速一体化工具链

Overview

概述

Biome is a fast, all-in-one toolchain for web projects written in Rust. It replaces both ESLint and Prettier with a single tool that's 100x faster and provides zero-config defaults.

Key Features:

Single tool for linting and formatting
100x faster than ESLint
Zero configuration by default
Built-in import sorting
TypeScript-first design
Partial Prettier compatibility
Native monorepo support
VS Code integration

Installation:

bash

npm install --save-dev @biomejs/biome

Biome是一款基于Rust开发的、面向Web项目的快速一体化工具链。它用单个工具替代了ESLint和Prettier，速度快100倍，并且提供零配置默认项。

核心特性:

单一工具兼具代码检查与格式化功能
速度比ESLint快100倍
默认零配置
内置导入排序功能
优先支持TypeScript
部分兼容Prettier
原生支持单体仓库（Monorepo）
支持VS Code集成

安装:

bash

npm install --save-dev @biomejs/biome

Quick Start

快速开始

1. Initialize Biome

1. 初始化Biome

bash

undefined

bash

undefined

Create biome.json configuration

创建biome.json配置文件

npx @biomejs/biome init

Check your project

检查项目代码

npx @biomejs/biome check .

Fix issues automatically

自动修复问题

npx @biomejs/biome check --write .

Format only

仅执行格式化

npx @biomejs/biome format --write .

Lint only

仅执行代码检查

npx @biomejs/biome lint .

undefined

npx @biomejs/biome lint .

undefined

2. Package.json Scripts

2. Package.json脚本配置

json

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

json

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

3. Basic Configuration

3. 基础配置

json

{
  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
  "vcs": {
    "enabled": true,
    "clientKind": "git",
    "useIgnoreFile": true
  },
  "files": {
    "ignoreUnknown": false,
    "ignore": ["node_modules", "dist", "build", ".next"]
  },
  "formatter": {
    "enabled": true,
    "indentStyle": "space",
    "indentWidth": 2,
    "lineWidth": 100
  },
  "linter": {
    "enabled": true,
    "rules": {
      "recommended": true
    }
  },
  "javascript": {
    "formatter": {
      "quoteStyle": "single",
      "semicolons": "asNeeded",
      "trailingCommas": "all"
    }
  }
}

json

{
  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
  "vcs": {
    "enabled": true,
    "clientKind": "git",
    "useIgnoreFile": true
  },
  "files": {
    "ignoreUnknown": false,
    "ignore": ["node_modules", "dist", "build", ".next"]
  },
  "formatter": {
    "enabled": true,
    "indentStyle": "space",
    "indentWidth": 2,
    "lineWidth": 100
  },
  "linter": {
    "enabled": true,
    "rules": {
      "recommended": true
    }
  },
  "javascript": {
    "formatter": {
      "quoteStyle": "single",
      "semicolons": "asNeeded",
      "trailingCommas": "all"
    }
  }
}

Core Commands

核心命令

Check Command (Recommended)

检查命令（推荐）

The

check

command runs both linting and formatting:

bash

undefined

check

命令同时执行代码检查和格式化：

bash

undefined

Check all files

检查所有文件

biome check .

Fix issues automatically

自动修复问题

biome check --write .

Unsafe fixes (may change behavior)

不安全修复（可能改变代码行为）

biome check --write --unsafe .

Apply suggested fixes

应用建议的修复方案

biome check --write --unsafe --apply-suggested

Check specific files

检查指定文件

biome check src/**/*.ts

CI mode (exit with error on issues)

CI模式（存在问题时以错误码退出）

biome ci .

undefined

biome ci .

undefined

Format Command

格式化命令

Format code without linting:

bash

undefined

仅执行代码格式化，不进行检查：

bash

undefined

Format all files

格式化所有文件

biome format --write .

Check formatting without changing files

检查格式但不修改文件

biome format .

Format specific files

格式化指定文件

biome format --write src/**/*.{ts,tsx,js,jsx}

Format stdin

格式化标准输入内容

echo "const x={a:1}" | biome format --stdin-file-path=file.js

undefined

echo "const x={a:1}" | biome format --stdin-file-path=file.js

undefined

Lint Command

代码检查命令

Lint code without formatting:

bash

undefined

仅执行代码检查，不进行格式化：

bash

undefined

Lint all files

检查所有文件

biome lint .

Fix linting issues

修复代码检查问题

biome lint --write .

Show rule names

显示规则名称

biome lint --verbose .

Apply unsafe fixes

应用不安全修复

biome lint --write --unsafe .

undefined

biome lint --write --unsafe .

undefined

Configuration Deep Dive

配置深度解析

Formatter Configuration

格式化配置

json

{
  "formatter": {
    "enabled": true,
    "formatWithErrors": false,
    "indentStyle": "space",
    "indentWidth": 2,
    "lineEnding": "lf",
    "lineWidth": 80,
    "attributePosition": "auto"
  },
  "javascript": {
    "formatter": {
      "quoteStyle": "single",
      "jsxQuoteStyle": "double",
      "quoteProperties": "asNeeded",
      "trailingCommas": "all",
      "semicolons": "asNeeded",
      "arrowParentheses": "always",
      "bracketSpacing": true,
      "bracketSameLine": false
    }
  },
  "json": {
    "formatter": {
      "trailingCommas": "none"
    }
  }
}

json

{
  "formatter": {
    "enabled": true,
    "formatWithErrors": false,
    "indentStyle": "space",
    "indentWidth": 2,
    "lineEnding": "lf",
    "lineWidth": 80,
    "attributePosition": "auto"
  },
  "javascript": {
    "formatter": {
      "quoteStyle": "single",
      "jsxQuoteStyle": "double",
      "quoteProperties": "asNeeded",
      "trailingCommas": "all",
      "semicolons": "asNeeded",
      "arrowParentheses": "always",
      "bracketSpacing": true,
      "bracketSameLine": false
    }
  },
  "json": {
    "formatter": {
      "trailingCommas": "none"
    }
  }
}

Linter Configuration

代码检查配置

json

{
  "linter": {
    "enabled": true,
    "rules": {
      "recommended": true,
      "a11y": {
        "recommended": true,
        "noAutofocus": "error",
        "useKeyWithClickEvents": "warn"
      },
      "complexity": {
        "recommended": true,
        "noForEach": "off",
        "useLiteralKeys": "error"
      },
      "correctness": {
        "recommended": true,
        "noUnusedVariables": "error",
        "useExhaustiveDependencies": "warn"
      },
      "performance": {
        "recommended": true,
        "noAccumulatingSpread": "warn"
      },
      "security": {
        "recommended": true,
        "noDangerouslySetInnerHtml": "error"
      },
      "style": {
        "recommended": true,
        "noNonNullAssertion": "warn",
        "useConst": "error",
        "useTemplate": "warn"
      },
      "suspicious": {
        "recommended": true,
        "noExplicitAny": "warn",
        "noArrayIndexKey": "error"
      }
    }
  }
}

json

{
  "linter": {
    "enabled": true,
    "rules": {
      "recommended": true,
      "a11y": {
        "recommended": true,
        "noAutofocus": "error",
        "useKeyWithClickEvents": "warn"
      },
      "complexity": {
        "recommended": true,
        "noForEach": "off",
        "useLiteralKeys": "error"
      },
      "correctness": {
        "recommended": true,
        "noUnusedVariables": "error",
        "useExhaustiveDependencies": "warn"
      },
      "performance": {
        "recommended": true,
        "noAccumulatingSpread": "warn"
      },
      "security": {
        "recommended": true,
        "noDangerouslySetInnerHtml": "error"
      },
      "style": {
        "recommended": true,
        "noNonNullAssertion": "warn",
        "useConst": "error",
        "useTemplate": "warn"
      },
      "suspicious": {
        "recommended": true,
        "noExplicitAny": "warn",
        "noArrayIndexKey": "error"
      }
    }
  }
}

File Ignore Patterns

文件忽略规则

json

{
  "files": {
    "ignore": [
      "node_modules",
      "dist",
      "build",
      ".next",
      "coverage",
      "*.min.js",
      "public/assets/**"
    ],
    "ignoreUnknown": false,
    "include": ["src/**/*.ts", "src/**/*.tsx"]
  }
}

json

{
  "files": {
    "ignore": [
      "node_modules",
      "dist",
      "build",
      ".next",
      "coverage",
      "*.min.js",
      "public/assets/**"
    ],
    "ignoreUnknown": false,
    "include": ["src/**/*.ts", "src/**/*.tsx"]
  }
}

Override Configuration for Specific Files

特定文件的配置覆盖

json

{
  "overrides": [
    {
      "include": ["**/*.test.ts", "**/*.spec.ts"],
      "linter": {
        "rules": {
          "suspicious": {
            "noExplicitAny": "off"
          }
        }
      }
    },
    {
      "include": ["scripts/**/*.js"],
      "formatter": {
        "lineWidth": 120
      }
    }
  ]
}

json

{
  "overrides": [
    {
      "include": ["**/*.test.ts", "**/*.spec.ts"],
      "linter": {
        "rules": {
          "suspicious": {
            "noExplicitAny": "off"
          }
        }
      }
    },
    {
      "include": ["scripts/**/*.js"],
      "formatter": {
        "lineWidth": 120
      }
    }
  ]
}

VS Code Integration

VS Code集成

1. Install Biome Extension

1. 安装Biome扩展

bash

undefined

bash

undefined

Install from VS Code marketplace

从VS Code应用市场安装

code --install-extension biomejs.biome

undefined

code --install-extension biomejs.biome

undefined

2. VS Code Settings (

.vscode/settings.json

)

2. VS Code设置（

.vscode/settings.json

）

json

{
  "[javascript]": {
    "editor.defaultFormatter": "biomejs.biome",
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
      "quickfix.biome": "explicit",
      "source.organizeImports.biome": "explicit"
    }
  },
  "[typescript]": {
    "editor.defaultFormatter": "biomejs.biome",
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
      "quickfix.biome": "explicit",
      "source.organizeImports.biome": "explicit"
    }
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "biomejs.biome",
    "editor.formatOnSave": true
  },
  "[json]": {
    "editor.defaultFormatter": "biomejs.biome",
    "editor.formatOnSave": true
  },
  "biome.lspBin": "./node_modules/@biomejs/biome/bin/biome"
}

json

{
  "[javascript]": {
    "editor.defaultFormatter": "biomejs.biome",
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
      "quickfix.biome": "explicit",
      "source.organizeImports.biome": "explicit"
    }
  },
  "[typescript]": {
    "editor.defaultFormatter": "biomejs.biome",
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
      "quickfix.biome": "explicit",
      "source.organizeImports.biome": "explicit"
    }
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "biomejs.biome",
    "editor.formatOnSave": true
  },
  "[json]": {
    "editor.defaultFormatter": "biomejs.biome",
    "editor.formatOnSave": true
  },
  "biome.lspBin": "./node_modules/@biomejs/biome/bin/biome"
}

3. Workspace Settings

3. 工作区设置

json

{
  "editor.formatOnSave": true,
  "editor.formatOnPaste": true,
  "editor.defaultFormatter": "biomejs.biome",
  "biome.rename": true,
  "files.autoSave": "onFocusChange"
}

json

{
  "editor.formatOnSave": true,
  "editor.formatOnPaste": true,
  "editor.defaultFormatter": "biomejs.biome",
  "biome.rename": true,
  "files.autoSave": "onFocusChange"
}

Migration from ESLint and Prettier

从ESLint和Prettier迁移

1. Remove Old Tools

1. 移除旧工具

bash

undefined

bash

undefined

Remove ESLint and Prettier

卸载ESLint和Prettier

npm uninstall eslint prettier eslint-config-prettier
eslint-plugin-react eslint-plugin-import
@typescript-eslint/parser @typescript-eslint/eslint-plugin

Remove configuration files

删除配置文件

rm .eslintrc.js .eslintrc.json .prettierrc .prettierignore

undefined

rm .eslintrc.js .eslintrc.json .prettierrc .prettierignore

undefined

2. Migrate Configuration

2. 迁移配置

Use Biome's migration tool:

bash

undefined

使用Biome的迁移工具：

bash

undefined

Migrate from Prettier config

从Prettier配置迁移

biome migrate prettier --write

Migrate from ESLint config

从ESLint配置迁移

biome migrate eslint --write

undefined

biome migrate eslint --write

undefined

3. Manual Migration

3. 手动迁移

Prettier → Biome Formatter:

json

// .prettierrc (old)
{
  "semi": false,
  "singleQuote": true,
  "trailingComma": "all",
  "printWidth": 100
}

// biome.json (new)
{
  "formatter": {
    "lineWidth": 100
  },
  "javascript": {
    "formatter": {
      "semicolons": "asNeeded",
      "quoteStyle": "single",
      "trailingCommas": "all"
    }
  }
}

ESLint → Biome Linter:

json

// .eslintrc.json (old)
{
  "rules": {
    "no-unused-vars": "error",
    "prefer-const": "warn"
  }
}

// biome.json (new)
{
  "linter": {
    "rules": {
      "correctness": {
        "noUnusedVariables": "error"
      },
      "style": {
        "useConst": "warn"
      }
    }
  }
}

Prettier → Biome格式化工具:

json

// .prettierrc（旧）
{
  "semi": false,
  "singleQuote": true,
  "trailingComma": "all",
  "printWidth": 100
}

// biome.json（新）
{
  "formatter": {
    "lineWidth": 100
  },
  "javascript": {
    "formatter": {
      "semicolons": "asNeeded",
      "quoteStyle": "single",
      "trailingCommas": "all"
    }
  }
}

ESLint → Biome代码检查工具:

json

// .eslintrc.json（旧）
{
  "rules": {
    "no-unused-vars": "error",
    "prefer-const": "warn"
  }
}

// biome.json（新）
{
  "linter": {
    "rules": {
      "correctness": {
        "noUnusedVariables": "error"
      },
      "style": {
        "useConst": "warn"
      }
    }
  }
}

4. Update Scripts

4. 更新脚本

json

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

json

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

Git Hooks Integration

Git钩子集成

Using Husky + lint-staged

使用Husky + lint-staged

bash

undefined

bash

undefined

Install dependencies

安装依赖

npm install --save-dev husky lint-staged npx husky init


**`.husky/pre-commit`**:
```bash
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npx lint-staged

package.json
:

json

{
  "lint-staged": {
    "*.{js,ts,jsx,tsx,json}": [
      "biome check --write --no-errors-on-unmatched"
    ]
  }
}

npm install --save-dev husky lint-staged npx husky init


**`.husky/pre-commit`**:
```bash
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npx lint-staged

package.json
:

json

{
  "lint-staged": {
    "*.{js,ts,jsx,tsx,json}": [
      "biome check --write --no-errors-on-unmatched"
    ]
  }
}

Using Lefthook

使用Lefthook

lefthook.yml
:

yaml

pre-commit:
  commands:
    lint:
      glob: "*.{js,ts,jsx,tsx,json}"
      run: biome check --write --no-errors-on-unmatched {staged_files}

lefthook.yml
:

yaml

pre-commit:
  commands:
    lint:
      glob: "*.{js,ts,jsx,tsx,json}"
      run: biome check --write --no-errors-on-unmatched {staged_files}

Simple Git Hook (no dependencies)

简单Git钩子（无依赖）

.git/hooks/pre-commit
:

bash

#!/bin/bash

.git/hooks/pre-commit
:

bash

#!/bin/bash

Get staged files

获取暂存的文件

STAGED_FILES=$(git diff --cached --name-only --diff-filter=ACM | grep -E '.(js|ts|jsx|tsx|json)$')

if [ -n "$STAGED_FILES" ]; then echo "Running Biome on staged files..." npx @biomejs/biome check --write --no-errors-on-unmatched $STAGED_FILES

Add formatted files back to staging

git add $STAGED_FILES fi

undefined

STAGED_FILES=$(git diff --cached --name-only --diff-filter=ACM | grep -E '.(js|ts|jsx|tsx|json)$')

if [ -n "$STAGED_FILES" ]; then echo "正在对暂存文件执行Biome检查..." npx @biomejs/biome check --write --no-errors-on-unmatched $STAGED_FILES

将格式化后的文件重新加入暂存

git add $STAGED_FILES fi

undefined

CI/CD Integration

CI/CD集成

GitHub Actions

yaml

name: Biome CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  biome:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Run Biome CI
        run: npx @biomejs/biome ci .

      - name: Check formatting
        run: npx @biomejs/biome format .

      - name: Lint
        run: npx @biomejs/biome lint .

yaml

name: Biome CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  biome:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'

      - name: 安装依赖
        run: npm ci

      - name: 执行Biome CI检查
        run: npx @biomejs/biome ci .

      - name: 检查格式
        run: npx @biomejs/biome format .

      - name: 代码检查
        run: npx @biomejs/biome lint .

GitLab CI

yaml

biome:
  image: node:20-alpine
  stage: test
  script:
    - npm ci
    - npx @biomejs/biome ci .
  cache:
    paths:
      - node_modules/
  only:
    - merge_requests
    - main

yaml

biome:
  image: node:20-alpine
  stage: test
  script:
    - npm ci
    - npx @biomejs/biome ci .
  cache:
    paths:
      - node_modules/
  only:
    - merge_requests
    - main

CircleCI

yaml

version: 2.1

jobs:
  biome:
    docker:
      - image: cimg/node:20.11
    steps:
      - checkout
      - restore_cache:
          keys:
            - deps-{{ checksum "package-lock.json" }}
      - run: npm ci
      - save_cache:
          paths:
            - node_modules
          key: deps-{{ checksum "package-lock.json" }}
      - run: npx @biomejs/biome ci .

workflows:
  test:
    jobs:
      - biome

yaml

version: 2.1

jobs:
  biome:
    docker:
      - image: cimg/node:20.11
    steps:
      - checkout
      - restore_cache:
          keys:
            - deps-{{ checksum "package-lock.json" }}
      - run: npm ci
      - save_cache:
          paths:
            - node_modules
          key: deps-{{ checksum "package-lock.json" }}
      - run: npx @biomejs/biome ci .

workflows:
  test:
    jobs:
      - biome

Import Sorting

导入排序

Biome includes built-in import sorting:

bash

undefined

Biome内置了导入排序功能：

bash

undefined

Organize imports

整理导入语句

biome check --write --organize-imports-enabled=true .


**Configuration**:
```json
{
  "organizeImports": {
    "enabled": true
  }
}

Example:

typescript

// Before
import { useState } from 'react';
import axios from 'axios';
import { Button } from './components/Button';
import type { User } from './types';
import './styles.css';

// After (sorted)
import type { User } from './types';

import axios from 'axios';
import { useState } from 'react';

import { Button } from './components/Button';

import './styles.css';

biome check --write --organize-imports-enabled=true .


**配置**:
```json
{
  "organizeImports": {
    "enabled": true
  }
}

示例:

typescript

// 排序前
import { useState } from 'react';
import axios from 'axios';
import { Button } from './components/Button';
import type { User } from './types';
import './styles.css';

// 排序后
import type { User } from './types';

import axios from 'axios';
import { useState } from 'react';

import { Button } from './components/Button';

import './styles.css';

TypeScript Support

TypeScript支持

Biome has first-class TypeScript support:

json

{
  "linter": {
    "rules": {
      "suspicious": {
        "noExplicitAny": "warn",
        "noUnsafeDeclarationMerging": "error"
      },
      "correctness": {
        "noUnusedVariables": "error"
      },
      "style": {
        "useImportType": "error",
        "useExportType": "error"
      }
    }
  }
}

Type-aware linting:

typescript

// Biome detects unused variables
const unused = 123; // ❌ Error

// Enforces type imports
import { User } from './types'; // ❌ Error
import type { User } from './types'; // ✅ Correct

// Detects unsafe type assertions
const num = "123" as any as number; // ⚠️ Warning

Biome对TypeScript提供一流的支持：

json

{
  "linter": {
    "rules": {
      "suspicious": {
        "noExplicitAny": "warn",
        "noUnsafeDeclarationMerging": "error"
      },
      "correctness": {
        "noUnusedVariables": "error"
      },
      "style": {
        "useImportType": "error",
        "useExportType": "error"
      }
    }
  }
}

类型感知代码检查:

typescript

// Biome检测到未使用的变量
const unused = 123; // ❌ 错误

// 强制使用类型导入
import { User } from './types'; // ❌ 错误
import type { User } from './types'; // ✅ 正确

// 检测不安全的类型断言
const num = "123" as any as number; // ⚠️ 警告

Monorepo Support

单体仓库（Monorepo）支持

Biome works great in monorepos:

Biome在单体仓库中表现出色：

Project Structure

项目结构

my-monorepo/
├── biome.json (root config)
├── packages/
│   ├── web/
│   │   └── biome.json (extends root)
│   ├── api/
│   │   └── biome.json
│   └── shared/
│       └── biome.json

my-monorepo/
├── biome.json（根配置）
├── packages/
│   ├── web/
│   │   └── biome.json（继承根配置）
│   ├── api/
│   │   └── biome.json
│   └── shared/
│       └── biome.json

Root Configuration

根配置

json

{
  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
  "extends": [],
  "formatter": {
    "enabled": true,
    "indentStyle": "space",
    "indentWidth": 2
  },
  "linter": {
    "enabled": true,
    "rules": {
      "recommended": true
    }
  }
}

json

{
  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
  "extends": [],
  "formatter": {
    "enabled": true,
    "indentStyle": "space",
    "indentWidth": 2
  },
  "linter": {
    "enabled": true,
    "rules": {
      "recommended": true
    }
  }
}

Package Override

包配置覆盖

json

{
  "extends": ["../../biome.json"],
  "formatter": {
    "lineWidth": 100
  },
  "linter": {
    "rules": {
      "style": {
        "noNonNullAssertion": "off"
      }
    }
  }
}

json

{
  "extends": ["../../biome.json"],
  "formatter": {
    "lineWidth": 100
  },
  "linter": {
    "rules": {
      "style": {
        "noNonNullAssertion": "off"
      }
    }
  }
}

Monorepo Scripts

单体仓库脚本

json

{
  "scripts": {
    "check": "biome check .",
    "check:packages": "biome check packages/*",
    "format": "biome format --write .",
    "lint": "biome lint packages/*"
  }
}

json

{
  "scripts": {
    "check": "biome check .",
    "check:packages": "biome check packages/*",
    "format": "biome format --write .",
    "lint": "biome lint packages/*"
  }
}

Performance Benefits

性能优势

Speed Comparison

速度对比

Tool	Time (10,000 files)
ESLint + Prettier	~60s
Biome	~0.6s

100x faster on average workloads.

工具	处理10,000个文件的时间
ESLint + Prettier	~60秒
Biome	~0.6秒

在常规工作负载下速度快100倍。

Caching

缓存机制

Biome includes intelligent caching:

bash

undefined

Biome内置智能缓存：

bash

undefined

First run (no cache)

首次运行（无缓存）

biome check . # 1.2s

biome check . # 1.2秒

Second run (with cache)

第二次运行（带缓存）

biome check . # 0.1s

biome check . # 0.1秒

Clear cache

清除缓存

rm -rf node_modules/.cache/biome

undefined

rm -rf node_modules/.cache/biome

undefined

Parallel Processing

并行处理

Biome uses all CPU cores by default:

bash

undefined

Biome默认使用所有CPU核心：

bash

undefined

Limit CPU cores

限制CPU核心数

biome check --max-diagnostics=50 .

Verbose output

详细输出

biome check --verbose .

undefined

biome check --verbose .

undefined

Common Patterns

常见配置模式

React Projects

React项目

json

{
  "linter": {
    "rules": {
      "a11y": {
        "recommended": true,
        "useButtonType": "error",
        "useKeyWithClickEvents": "error"
      },
      "correctness": {
        "useExhaustiveDependencies": "warn",
        "useHookAtTopLevel": "error"
      },
      "suspicious": {
        "noArrayIndexKey": "error"
      }
    }
  },
  "javascript": {
    "formatter": {
      "jsxQuoteStyle": "double"
    }
  }
}

json

{
  "linter": {
    "rules": {
      "a11y": {
        "recommended": true,
        "useButtonType": "error",
        "useKeyWithClickEvents": "error"
      },
      "correctness": {
        "useExhaustiveDependencies": "warn",
        "useHookAtTopLevel": "error"
      },
      "suspicious": {
        "noArrayIndexKey": "error"
      }
    }
  },
  "javascript": {
    "formatter": {
      "jsxQuoteStyle": "double"
    }
  }
}

Next.js Projects

Next.js项目

json

{
  "files": {
    "ignore": [".next", "out", "node_modules"]
  },
  "overrides": [
    {
      "include": ["app/**/*.tsx", "pages/**/*.tsx"],
      "linter": {
        "rules": {
          "a11y": {
            "recommended": true
          }
        }
      }
    }
  ]
}

json

{
  "files": {
    "ignore": [".next", "out", "node_modules"]
  },
  "overrides": [
    {
      "include": ["app/**/*.tsx", "pages/**/*.tsx"],
      "linter": {
        "rules": {
          "a11y": {
            "recommended": true
          }
        }
      }
    }
  ]
}

Node.js Backend

Node.js后端

json

{
  "linter": {
    "rules": {
      "security": {
        "recommended": true,
        "noGlobalEval": "error"
      },
      "correctness": {
        "noUnusedVariables": "error"
      }
    }
  },
  "javascript": {
    "formatter": {
      "semicolons": "always"
    }
  }
}

json

{
  "linter": {
    "rules": {
      "security": {
        "recommended": true,
        "noGlobalEval": "error"
      },
      "correctness": {
        "noUnusedVariables": "error"
      }
    }
  },
  "javascript": {
    "formatter": {
      "semicolons": "always"
    }
  }
}

Best Practices

最佳实践

Use
biome check
instead of separate format/lint commands
Enable
--write
flag for automatic fixes
Configure VS Code for format-on-save
Add git hooks to enforce quality before commits
Use CI mode (
```
biome ci
```
) in continuous integration
Start with recommended rules then customize
Leverage import sorting to organize imports automatically
Use overrides for different file types or directories
Enable VCS integration to respect .gitignore
Keep configuration minimal - Biome has smart defaults

使用
biome check
命令替代单独的格式化/检查命令
启用
--write
参数实现自动修复
配置VS Code开启保存时自动格式化
添加Git钩子确保提交前代码质量
在持续集成中使用CI模式（
```
biome ci
```
）
从推荐规则开始，再根据需求自定义
利用导入排序功能自动整理导入语句
使用配置覆盖适配不同文件类型或目录
启用VCS集成以尊重.gitignore规则
保持配置简洁 - Biome具备智能默认项

Troubleshooting

故障排除

Biome Not Formatting

Biome不执行格式化

bash

undefined

bash

undefined

Check if formatter is enabled

检查格式化功能是否启用

biome rage

Verify file is not ignored

验证文件是否被忽略

biome check --verbose src/file.ts

Check VS Code extension logs

查看VS Code扩展日志

View → Output → Biome

视图 → 输出 → Biome

undefined

undefined

Conflicts with Prettier

与Prettier冲突

bash

undefined

bash

undefined

Disable Prettier in VS Code settings

在VS Code设置中禁用Prettier

"[javascript]": { "editor.defaultFormatter": "biomejs.biome" }

Remove Prettier dependencies

卸载Prettier依赖

npm uninstall prettier

undefined

npm uninstall prettier

undefined

Performance Issues

性能问题

bash

undefined

bash

undefined

Check cache location

查看缓存位置

biome rage

Clear cache

清除缓存

rm -rf node_modules/.cache/biome

Reduce max diagnostics

减少最大诊断数

biome check --max-diagnostics=20 .

undefined

biome check --max-diagnostics=20 .

undefined

Rule Configuration Not Working

规则配置不生效

json

// Ensure correct category
{
  "linter": {
    "rules": {
      "correctness": {  // Category name matters
        "noUnusedVariables": "error"
      }
    }
  }
}

json

// 确保使用正确的规则分类
{
  "linter": {
    "rules": {
      "correctness": {  // 分类名称必须正确
        "noUnusedVariables": "error"
      }
    }
  }
}

Local Biome Configs (Your Repos)

本地Biome配置示例（实际项目）

Patterns from active projects:

ai-code-review/biome.json

files.includes

targets

src/**/*.ts

and excludes tests,

lineWidth: 100

, single quotes, semicolons always, and

noExplicitAny: warn

itinerizer-ts/biome.json

files.ignore

includes

node_modules

dist

.claude

, and data directories;

organizeImports.enabled = true

```
matsuoka-com
```
and
```
diogenes
```
use similar formatting defaults (2-space indent, lineWidth 100).

Common scripts:

json

{
  "lint": "biome check src/ --diagnostic-level=error",
  "lint:fix": "biome check src/ --write",
  "format": "biome format src/ --write"
}

活跃项目中的配置模式：

ai-code-review/biome.json

files.includes

指定

src/**/*.ts

并排除测试文件，

lineWidth: 100

，单引号，始终添加分号，

noExplicitAny: warn

。

itinerizer-ts/biome.json

files.ignore

包含

node_modules

dist

.claude

和数据目录；

organizeImports.enabled = true

。

```
matsuoka-com
```
和
```
diogenes
```
使用类似的格式化默认项（2空格缩进，行宽100）。

常见脚本：

json

{
  "lint": "biome check src/ --diagnostic-level=error",
  "lint:fix": "biome check src/ --write",
  "format": "biome format src/ --write"
}

Resources

资源

Official Docs: https://biomejs.dev
VS Code Extension: https://marketplace.visualstudio.com/items?itemName=biomejs.biome
GitHub: https://github.com/biomejs/biome
Rules Reference: https://biomejs.dev/linter/rules/
Migration Guide: https://biomejs.dev/guides/migrate-eslint-prettier/

官方文档: https://biomejs.dev
VS Code扩展: https://marketplace.visualstudio.com/items?itemName=biomejs.biome
GitHub仓库: https://github.com/biomejs/biome
规则参考: https://biomejs.dev/linter/rules/
迁移指南: https://biomejs.dev/guides/migrate-eslint-prettier/

Summary

总结

Biome is a fast all-in-one linter and formatter
100x faster than ESLint + Prettier
Zero config by default with smart defaults
Built in Rust for maximum performance
TypeScript-first with excellent type support
Import sorting included out of the box
VS Code integration with official extension
Perfect for modern web projects, monorepos, CI/CD
Easy migration from ESLint and Prettier

Biome是一款快速的一体化代码检查与格式化工具
速度比ESLint + Prettier快100倍
默认零配置，具备智能默认项
基于Rust开发，实现极致性能
优先支持TypeScript，提供一流的类型支持
内置导入排序功能
官方VS Code扩展，集成便捷
适用于现代Web项目、单体仓库、CI/CD流程
轻松从ESLint和Prettier迁移

biome

Original

Translation

Biome - Fast All-in-One Toolchain

Biome - 快速一体化工具链

Overview

概述

Quick Start

快速开始

1. Initialize Biome

1. 初始化Biome

Create biome.json configuration

创建biome.json配置文件

Check your project

检查项目代码

Fix issues automatically

自动修复问题

Format only

仅执行格式化

Lint only

仅执行代码检查

2. Package.json Scripts

2. Package.json脚本配置

3. Basic Configuration

3. 基础配置

Core Commands

核心命令

Check Command (Recommended)

检查命令（推荐）

Check all files

检查所有文件

Fix issues automatically

自动修复问题

Unsafe fixes (may change behavior)

不安全修复（可能改变代码行为）

Apply suggested fixes

应用建议的修复方案

Check specific files

检查指定文件

CI mode (exit with error on issues)

CI模式（存在问题时以错误码退出）

Format Command

格式化命令

Format all files

格式化所有文件

Check formatting without changing files

检查格式但不修改文件

Format specific files

格式化指定文件

Format stdin

格式化标准输入内容

Lint Command

代码检查命令

Lint all files

检查所有文件

Fix linting issues

修复代码检查问题

Show rule names

显示规则名称

Apply unsafe fixes

应用不安全修复

Configuration Deep Dive

配置深度解析

Formatter Configuration

格式化配置

Linter Configuration

代码检查配置

File Ignore Patterns

文件忽略规则

Override Configuration for Specific Files

特定文件的配置覆盖

VS Code Integration

VS Code集成

1. Install Biome Extension

1. 安装Biome扩展

Install from VS Code marketplace

从VS Code应用市场安装

2. VS Code Settings (.vscode/settings.json)

2. VS Code设置（.vscode/settings.json）

3. Workspace Settings

2. VS Code Settings (
`.vscode/settings.json`
)

2. VS Code设置（
`.vscode/settings.json`
）