| | |

Biome 14 🧹 Migrating from Prettier — biome migrate prettier

⏱️ Estimated read: 12 min | |

The biome migrate prettier command is the automated bridge between a Prettier configuration and a Biome configuration. It reads the .prettierrc or the prettier.json file and the .prettierignore file, and it writes the equivalent options into the biome.json or creates the file if it does not exist . The command is the first step of the migration, and the manual review is the second. The output is not a one-to-one translation of the Prettier file; it is the Biome configuration that reproduces the Prettier behavior as closely as the formatter allows.

The command’s most important behavior is the explicit option writing. Biome’s formatter defaults differ from Prettier’s—Biome indents with tabs while Prettier uses spaces —so the command writes every option explicitly to keep the current output . A project that runs the migration and then inspects the biome.json will see the full set of the formatting options spelled out, even the ones that match the Prettier default. The explicitness is the mechanism that protects the existing formatting from the default drift.

Key point: biome migrate prettier --write reads the Prettier configuration and the ignore file, and it writes the equivalent options into the biome.json. Biome’s defaults differ from Prettier’s, so the command writes every option explicitly to preserve the output. The .prettierignore patterns become the files.includes exceptions, and the VCS integration must be enabled to keep the .gitignore behavior.


Why the migration is not a drop-in swap

The default-difference problem. Prettier and Biome share the same option philosophy, and Biome implements the Prettier options to reach the compatibility . But the defaults are not the same. The indentStyle is "tab" in Biome and the spaces in Prettier, and the quoteStyle is "double" in both . A project that migrates without the explicit options would see the indentation change from the spaces to the tabs, and the diff would touch every file. The explicit writing is the mechanism that prevents the churn, and the churn prevention is the reason the command writes the options rather than relying on the defaults.

The ignore-file problem. The .prettierignore file is the separate file, and its patterns are the globs that Prettier skips. The biome migrate prettier command ports the patterns into the files.includes array as the ! exceptions . The migration is the mechanism that keeps the ignored files ignored, and the ignore behavior is the reason the command reads the ignore file as well as the configuration file.

The VCS-integration problem. Prettier, ESLint, and Stylelint skip the files in the .gitignore by default. Biome does so only when its VCS integration is enabled . A project that migrates and does not enable the vcs.useIgnoreFile would see Biome process the files that Git ignores, and the build output would be formatted. The VCS integration is the mechanism that keeps the ignore behavior consistent with the previous tools, and the explicit enablement is the reason the migration guide calls it out.

The known-difference problem. The migration is not the perfect reproduction. Biome intentionally diverges from Prettier in a few cases: it unquotes the object properties that are valid ES2015+ identifiers (Prettier unquotes only the ES5 identifiers), it handles the assignment in the computed keys differently, and it formats the invalid syntaxes as the plain text instead of the Babel-lenient parse . The differences are the deliberate choices, and the migration guide links to the differences page for the full list.

The compatibility problem. Biome’s formatter matches Prettier’s output in 97% of cases, and it won the Prettier challenge launched by one of Prettier’s creators . The 3% is the intentional divergence, and the migration is the mechanism that gets the project to the 97% with the configuration that matches the project’s style. The remaining 3% is the manual review, and the review is the reason the migration is not the final step.


a. The command and the configuration output

The command is the three-word invocation with the --write flag. The flag is the mechanism that writes the output to the biome.json instead of printing it.

# The Prettier migration
biome migrate prettier --write

The command reads the .prettierrc or the prettier.json file, and it reads the .prettierignore file. The output is the biome.json with the formatter options and the files.includes array . The --write flag is the mechanism that applies the output, and the command without the flag is the preview.

// The Prettier configuration
{
  "semi": false,
  "singleQuote": true,
  "trailingComma": "es5",
  "tabWidth": 2,
  "useTabs": false
}
// The migrated biome.json (simplified)
{
  "formatter": {
    "indentStyle": "space",
    "indentWidth": 2
  },
  "javascript": {
    "formatter": {
      "semicolons": "asNeeded",
      "quoteStyle": "single",
      "trailingCommas": "es5"
    }
  }
}

The semi: false becomes the semicolons: "asNeeded", the singleQuote: true becomes the quoteStyle: "single", and the trailingComma: "es5" becomes the trailingCommas: "es5" . The tabWidth: 2 and the useTabs: false become the indentWidth: 2 and the indentStyle: "space". The mapping is the mechanism that translates the Prettier vocabulary to the Biome vocabulary, and the explicit writing is the reason the output is verbose.

The .prettierignore patterns become the files.includes exceptions. The migration reads the ignore file and appends the ! patterns to the includes array.

// The migrated biome.json with the ignore patterns
{
  "files": {
    "includes": [
      "**",
      "!**/dist",
      "!**/coverage",
      "!**/*.min.js"
    ]
  }
}

The ** is the include-all, and the ! patterns are the exceptions from the .prettierignore . The files.includes is the single array that replaced the separate include and ignore fields, and the migration is the mechanism that ports the old ignore file to the new array.


b. The VCS integration and the post-migration review

The VCS integration is the separate step that the migration does not do automatically. The vcs.useIgnoreFile: true is the flag that makes Biome read the .gitignore, and the flag is the mechanism that keeps the ignore behavior consistent with Prettier .

// biome.json — the VCS integration
{
  "vcs": {
    "enabled": true,
    "clientKind": "git",
    "useIgnoreFile": true
  }
}

The enabled and the clientKind are the required fields, and the useIgnoreFile is the flag that enables the .gitignore reading. The migration guide states the requirement explicitly: “ESLint, Prettier, and Stylelint skip the files in your .gitignore by default. Biome does so only when its VCS integration is enabled, so enable it to keep the same set of files ignored” . The enablement is the mechanism that keeps the ignored files ignored, and the explicit step is the reason the migration is not the complete.

The post-migration review is the manual step. The command writes the options, and the developer checks the output against the expected formatting. The review is the mechanism that catches the known differences: the unquoting of the ES2015+ identifiers, the computed-key assignment, and the invalid-syntax handling . The review is the reason the migration is not the one-command-and-done, and the review is the step that the documentation recommends.

The removal of the Prettier dependencies is the final step. The migration guide states: “Once you are satisfied with the result, remove ESLint, Prettier, Stylelint, and their plugins from your dependencies, and replace their editor extensions with Biome’s” . The removal is the mechanism that completes the migration, and the editor extension replacement is the mechanism that keeps the format-on-save working.

The editor integration is the separate concern. The VS Code settings need the editor.defaultFormatter: "biomejs.biome" and the editor.formatOnSave: true to replace the Prettier extension. The eslint-config-prettier is not needed, because Biome has no formatter-linter conflict. The removal of the Prettier plugins is the mechanism that removes the redundant dependencies, and the prettier-plugin-tailwindcss is the common example of the plugin that Biome’s built-in support replaces .


Complete Example Session

// ============================================
// PART 1: THE PRETTIER CONFIGURATION
// ============================================

// .prettierrc
{
  "semi": false,
  "singleQuote": true,
  "trailingComma": "es5",
  "tabWidth": 2,
  "useTabs": false,
  "printWidth": 100
}

// ============================================
// PART 2: THE PRETTIER IGNORE
// ============================================

// .prettierignore
// dist
// coverage
// *.min.js

// ============================================
// PART 3: THE MIGRATION COMMAND
// ============================================

// biome migrate prettier --write

// The command reads the .prettierrc and the .prettierignore.
// The output is the biome.json with the equivalent options.

// ============================================
// PART 4: THE MIGRATED CONFIGURATION
// ============================================

// biome.json (simplified)
{
  "formatter": {
    "indentStyle": "space",
    "indentWidth": 2,
    "lineWidth": 100
  },
  "javascript": {
    "formatter": {
      "semicolons": "asNeeded",
      "quoteStyle": "single",
      "trailingCommas": "es5"
    }
  },
  "files": {
    "includes": ["**", "!dist", "!coverage", "!*.min.js"]
  }
}

// ============================================
// PART 5: THE VCS INTEGRATION
// ============================================

// biome.json — the added VCS configuration
{
  "vcs": {
    "enabled": true,
    "clientKind": "git",
    "useIgnoreFile": true
  }
}

// The .gitignore is respected.

// ============================================
// PART 6: THE KNOWN DIFFERENCE
// ============================================

// The object properties that are valid ES2015+ identifiers are unquoted.
// Prettier unquotes only the ES5 identifiers.
// The difference is intentional.

// ============================================
// PART 7: THE INVALID SYNTAX HANDLING
// ============================================

// Biome's parser is stricter than Prettier's.
// The invalid syntax is printed verbatim as the bogus node.
// The behavior is the intentional divergence.

// ============================================
// PART 8: THE DEPENDENCY REMOVAL
// ============================================

// npm uninstall prettier eslint-config-prettier
// npm uninstall prettier-plugin-tailwindcss
// The dependencies are removed after the review.

// ============================================
// PART 9: THE EDITOR REPLACEMENT
// ============================================

// The Prettier extension is disabled.
// The Biome extension is enabled.
// The editor.defaultFormatter is "biomejs.biome".

// ============================================
// PART 10: THE CHECKLIST
// ============================================

// [ ] The migration command is run with --write.
// [ ] The formatter options are written explicitly.
// [ ] The .prettierignore patterns are in the files.includes.
// [ ] The VCS integration is enabled for the .gitignore.
// [ ] The known differences are reviewed.
// [ ] The Prettier dependencies are removed.
// [ ] The editor extension is replaced.

The ten parts covered the Prettier configuration, the Prettier ignore, the migration command, the migrated configuration, the VCS integration, the known difference, the invalid syntax handling, the dependency removal, the editor replacement, and the checklist. The through-line is that the command ports the options, and the review catches the differences.


Quick Reference

The migration command

CommandPurpose
biome migrate prettierThe preview
biome migrate prettier --writeThe write

The Prettier to Biome mapping

PrettierBiome
semijavascript.formatter.semicolons
singleQuotejavascript.formatter.quoteStyle
trailingCommajavascript.formatter.trailingCommas
tabWidthformatter.indentWidth
useTabsformatter.indentStyle
printWidthformatter.lineWidth

The known differences

DifferenceDetail
The unquotingThe ES2015+ identifiers vs the ES5 only
The computed keysThe consistent handling
The invalid syntaxThe strict parse vs the lenient

The post-migration steps

StepPurpose
Enable the VCSKeep the .gitignore behavior
Review the outputCatch the known differences
Remove the dependenciesComplete the migration
Replace the editor extensionKeep the format on save

Best Practices

✅ Do This:

# Use the --write flag to apply the migration
biome migrate prettier --write                                    // ✅
// Enable the VCS integration for the .gitignore
{ "vcs": { "enabled": true, "clientKind": "git", "useIgnoreFile": true } } // ✅

❌ Don’t Do This:

# Assume the migration is a drop-in swap
biome migrate prettier // the known differences remain             // ❌

# Skip the VCS integration
// The .gitignore files are processed                             // ❌

Common Pitfalls

PitfallWhy It HappensFix
The indentation changesThe Biome default is the tabsThe migration writes the explicit indentStyle
The .gitignore is not respectedThe VCS integration is disabledEnable the vcs.useIgnoreFile
The known difference is missedThe review is skippedCheck the differences page
The editor still uses PrettierThe extension is not replacedSet the editor.defaultFormatter

Real-World Examples

1. The migration command

biome migrate prettier --write

2. The Prettier configuration

{ "semi": false, "singleQuote": true }

3. The migrated configuration

{ "javascript": { "formatter": { "semicolons": "asNeeded", "quoteStyle": "single" } } }

4. The ignore patterns

{ "files": { "includes": ["!dist"] } }

5. The VCS integration

{ "vcs": { "useIgnoreFile": true } }

6. The known difference

The ES2015+ identifiers are unquoted.

7. The dependency removal

npm uninstall prettier eslint-config-prettier

8. The editor replacement

{ "editor.defaultFormatter": "biomejs.biome" }

9. The Tailwind plugin

npm uninstall prettier-plugin-tailwindcss

10. The review

The migration output is reviewed against the existing formatting.

Visual

The Migration Flow

┌──────────────────────────────────────────────────────────────┐
│  THE MIGRATION FLOW                                          │
│                                                              │
│  The .prettierrc and the .prettierignore                     │
│         │                                                    │
│         ▼                                                    │
│  ┌─────────────────────┐                                    │
│  │ biome migrate       │  The command reads the files       │
│  │ prettier --write    │  and writes the biome.json         │
│  └──────────┬──────────┘                                    │
│             │                                                │
│             ▼                                                    │
│  ┌─────────────────────┐                                    │
│  │ The biome.json with │  The explicit options              │
│  │ the equivalent      │  The ignore patterns               │
│  └──────────┬──────────┘                                    │
│             │                                                │
│             ▼                                                    │
│  ┌─────────────────────┐                                    │
│  │ The manual review   │  The known differences             │
│  │ The VCS integration │  The .gitignore behavior           │
│  └─────────────────────┘                                    │
└──────────────────────────────────────────────────────────────┘

The Default Difference

┌──────────────────────────────────────────────────────────────┐
│  THE DEFAULT DIFFERENCE                                      │
│                                                              │
│  Prettier                    Biome                           │
│  ┌─────────────────────┐     ┌─────────────────────┐        │
│  │ indentStyle: spaces │     │ indentStyle: tabs   │        │
│  │                     │     │ (the default)       │        │
│  └─────────────────────┘     └─────────────────────┘        │
│                                                              │
│  The migration writes the explicit indentStyle.             │
└──────────────────────────────────────────────────────────────┘

The Post-Migration Steps

┌──────────────────────────────────────────────────────────────┐
│  THE POST-MIGRATION STEPS                                    │
│                                                              │
│  1. The migration command                                    │
│  2. The VCS integration                                      │
│  3. The manual review                                        │
│  4. The dependency removal                                   │
│  5. The editor replacement                                   │
│                                                              │
│  The steps are the sequence, and the sequence is the        │
│  complete migration.                                        │
└──────────────────────────────────────────────────────────────┘

Summary

ItemValue
The commandbiome migrate prettier --write
The inputThe .prettierrc and the .prettierignore
The outputThe biome.json with the explicit options
The defaultsThe Biome defaults differ from Prettier’s
The VCS integrationRequired for the .gitignore behavior
The known differencesThe 3% of the intentional divergence
The post-migrationThe review, the removal, the editor replacement

Key takeaways:

  • The command ports the Prettier options and the ignore patterns. The biome migrate prettier --write reads the .prettierrc and the .prettierignore, and it writes the equivalent options into the biome.json . The ignore patterns become the files.includes exceptions.
  • The options are written explicitly to preserve the output. Biome’s defaults differ from Prettier’s—the tabs vs the spaces—so the command writes every option to keep the current formatting . The explicitness is the mechanism that prevents the formatting churn.
  • The VCS integration is the separate step. Prettier skips the .gitignore files by default, and Biome does so only when the vcs.useIgnoreFile is enabled . The enablement is the mechanism that keeps the ignored files ignored.
  • The known differences are the intentional divergence. Biome unquotes the ES2015+ identifiers, handles the computed keys consistently, and formats the invalid syntax as the plain text . The differences are the 3% that the migration does not reproduce, and the review is the mechanism that catches them.
  • The migration is not complete until the dependencies are removed. The Prettier dependencies and the editor extension are the redundant after the migration . The removal is the mechanism that completes the switch, and the editor replacement is the mechanism that keeps the format on save working.

Remember: The Biome Prettier migration is the command that ports the configuration, and the review that catches the differences. The biome migrate prettier --write reads the Prettier files and writes the Biome configuration with the explicit options. The VCS integration keeps the ignore behavior, the review catches the known differences, and the dependency removal completes the switch. The migration is the sequence, and the sequence is the complete.

Was this helpful?


Stop using slow, ad-bloated tool sites! 🤮

🔎 Search “KandZ Tools” on Google to use many professional utilities for free.

KandZ.me is the ultimate minimalist hub for:
✅ Finance (Mortgage, Interest, Inflation)
✅ Tech (Base64, JSON, Dev Suite, IP)
✅ Health (BMI, BMR, TDEE)
✅ Productivity (Timer, Workspace, QR)

⚡️ Fast & Private
🔒 No data leaves your device
💎 100% Free

🔗 Use it now: https://tools.kandz.me
🔖 Bookmark it—you’ll need it later!