biome_skill

Overview

This skill helps teams lint, format, and organize frontend code using Biome 2.4. It guides configuration, type-aware linting, GritQL custom rules, import organization, and migration from ESLint/Prettier. Use it to set up CI checks, editor integration, and domain-based rule sets for JavaScript, TypeScript, JSX, CSS, and GraphQL.

How this skill works

The skill inspects and explains Biome configuration (biome.json), recommended CLI usage (biome check / biome ci), and key features like the type inference engine and domains. It describes how to enable type-aware rules (types domain), create and register GritQL rules, and configure the import organizer. It also covers migration commands and best practices for monorepos, IDE setups, and CI integration.

When to use it

• When adding or updating Biome to a project
• When configuring type-aware lint rules like noFloatingPromises
• When writing or registering custom GritQL lint rules
• When setting up CI checks and GitHub annotations
• When migrating from ESLint and/or Prettier to Biome

Best practices

• Always run biome check (not separate lint + format) in CI
• Keep one biome.json at the project root; use "extends": "//" in monorepos
• Pin exact Biome versions and run pnpm biome migrate --write after upgrades
• Enable only relevant domains (react, next, project, types) to limit overhead
• Use --write for safe fixes; use --write --unsafe only after review
• Enable VCS integration to support --changed and --staged workflows

Example use cases

• Add Biome to a TypeScript React repo and enable react + types domains with recommended rules
• Create a GritQL plugin to ban Object.assign and register it in biome.json
• Migrate an ESLint + Prettier codebase using pnpm biome migrate eslint --write followed by pnpm biome migrate prettier --write
• Configure VS Code to use Biome as default formatter and enable formatOnSave plus organizeImports on save
• Set up GitHub Actions to run biome ci . with the github reporter for annotated failures