Migrating from Prettier to Rome: A Developer's Guide

The Evolution of JavaScript Tooling

From Separate Tools to Unified Toolchains

For years, the standard JavaScript development workflow involved ESLint for catching code quality issues and Prettier for enforcing consistent formatting. While effective, this approach had significant drawbacks:

• Managing two separate configuration files
• Potential conflicts between ESLint's stylistic rules and Prettier's formatting
• Separate plugin ecosystems requiring careful coordination
• Slower execution times due to Node.js runtime overhead

ESLint, released in 2013, became the standard for JavaScript linting, while Prettier arrived in 2017 to solve formatting inconsistencies. Together they formed a powerful combination, but the overhead of maintaining two tools with overlapping concerns led developers to seek simpler solutions.

If you're still evaluating your linting options, our guide on modern ESLint alternatives provides a comprehensive comparison of available tools.

What Is Rome/Biome?

Rome Tools was an ambitious project created by Facebook in 2020 with the goal of building a unified toolchain for JavaScript development. It was designed from scratch to replace ESLint, Prettier, and other individual tools with a single, cohesive solution. The project gained significant attention in the developer community for its bold vision, as described by LogRocket's coverage of the Rome project.

In 2022, the Rome team announced they would no longer maintain the original Rome project. However, the community response was positive--developers recognized the value of the unified toolchain approach. This led to the creation of Biome, a fork of Rome that continues development with an active community and regular releases.

Biome maintains the core vision of Rome while advancing the project with new features, bug fixes, and improved performance. The tooling is written in Rust, providing significantly faster execution times compared to Node.js-based alternatives.

Why Migrate: The Case for Biome

Migration Process: Step by Step

Prerequisites and Preparation

Before beginning your migration, assess your current setup:

1. Audit your ESLint configuration: Note which rules you use, especially any custom or plugin-based rules
2. Review your Prettier settings: Identify your formatting preferences (quotes, semicolons, trailing commas, etc.)
3. Check for plugin dependencies: Some ESLint plugins may not have Biome equivalents

As outlined in A Million Monkeys' migration guide, this preparation phase is critical for a smooth transition.

Understanding your current linting setup is essential. Our guide on JavaScript linting options can help you evaluate where Biome fits into your workflow.

Configuration Deep Dive

Formatter Settings

Biome's formatter settings control indentation, line width, and overall code appearance:

"formatter": {
 "enabled": true,
 "indentStyle": "space", // or "tab"
 "indentWidth": 2,
 "lineWidth": 100,
 "ignore": []
}

The formatter applies to all supported file types and integrates seamlessly with the linter for consistent code quality.

Linter Rules

Rules can be set to "error" or "warn" to enable, "off" to disable, or "info" for informational messages:

"linter": {
 "enabled": true,
 "rules": {
 "recommended": true,
 "suspicious": {
 "noExplicitAny": "warn",
 "noArrayIndexKey": "warn"
 },
 "style": {
 "noNonNullAssertion": "off"
 },
 "complexity": {
 "noForEach": "off"
 }
 }
}

This configuration enables Biome's recommended rules while allowing teams to customize specific rules based on their preferences.

What You Gain and What You Lose

When to Migrate

Ideal Candidates for Migration

Migrating to Biome makes sense when:

1. Starting new projects: No existing configuration to maintain
2. Using primarily standard rules: Your ESLint config isn't heavily customized
3. Performance matters: Large codebases or CI pipelines where speed matters
4. Simplicity is valued: Willing to accept fewer rules for simpler tooling
5. React without heavy plugins: Not relying on jsx-a11y or other plugin-specific rules

When to Stay with ESLint + Prettier

Keep your current setup if:

1. You need comprehensive accessibility linting: Relying on eslint-plugin-jsx-a11y
2. Extensive custom rules: Have invested in custom ESLint rules
3. Framework-specific tooling: Your project depends on specialized plugins
4. Maximum compatibility needed: Working with diverse codebases and teams

For TypeScript-first development teams prioritizing performance and simplicity, Biome represents an excellent choice. Teams with complex linting requirements may benefit from a phased approach--adopting Biome for new code while maintaining ESLint for existing codebases.

Best Practices

Incremental Migration

For existing projects, consider an incremental approach:

1. Add Biome alongside ESLint + Prettier
2. Run Biome on new code first
3. Gradually apply Biome to modified files
4. Full migration when comfortable

Editor Setup

Configure your VS Code for Biome:

{
 "editor.formatOnSave": true,
 "editor.defaultFormatter": "biomejs.biome",
 "[javascript]": {
 "editor.defaultFormatter": "biomejs.biome"
 },
 "[typescript]": {
 "editor.defaultFormatter": "biomejs.biome"
 },
 "[typescriptreact]": {
 "editor.defaultFormatter": "biomejs.biome"
 }
}

Install the Biome VS Code extension from the marketplace for the best experience.

Git Hooks

With Husky, add to your pre-commit hook:

#!/bin/sh
npx @biomejs/biome check --write --changed .

The --changed flag ensures Biome only checks files that have been modified, making pre-commit checks lightning-fast even in large codebases.

Conclusion

Migrating from ESLint + Prettier to Biome represents a shift toward simpler, faster JavaScript tooling. The performance gains are significant--often 10x faster execution--while the unified toolchain reduces configuration complexity and dependency overhead.

However, the migration isn't without trade-offs. Biome's smaller rule set means some ESLint plugins won't have equivalents, and the younger ecosystem means less community knowledge to draw upon. For teams prioritizing TypeScript development with standard linting needs, Biome offers an excellent balance of performance and simplicity.

For new projects, Biome is an excellent default choice. For existing projects, evaluate whether Biome's rule coverage meets your needs. Many teams find the performance benefits and simplicity worth accepting some rule gaps. The JavaScript tooling landscape continues to evolve, and Biome represents a promising direction toward unified, high-performance development tools.

Combined with optimized bundle sizes and modern tooling approaches, Biome helps create a streamlined development workflow that prioritizes developer productivity.

Sources

1. A Million Monkeys: Replacing ESLint and Prettier for Biome - Comprehensive migration guide with benchmarks
2. AppSignal: Migrating A JavaScript Project from Prettier and ESLint to BiomeJS - Practical setup and configuration details
3. LogRocket: Migrating from Prettier to Rome - Historical context on Rome's development