Biome 14 🧹 Migrating from Prettier — biome migrate prettier
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
| Command | Purpose |
|---|---|
biome migrate prettier | The preview |
biome migrate prettier --write | The write |
The Prettier to Biome mapping
| Prettier | Biome |
|---|---|
semi | javascript.formatter.semicolons |
singleQuote | javascript.formatter.quoteStyle |
trailingComma | javascript.formatter.trailingCommas |
tabWidth | formatter.indentWidth |
useTabs | formatter.indentStyle |
printWidth | formatter.lineWidth |
The known differences
| Difference | Detail |
|---|---|
| The unquoting | The ES2015+ identifiers vs the ES5 only |
| The computed keys | The consistent handling |
| The invalid syntax | The strict parse vs the lenient |
The post-migration steps
| Step | Purpose |
|---|---|
| Enable the VCS | Keep the .gitignore behavior |
| Review the output | Catch the known differences |
| Remove the dependencies | Complete the migration |
| Replace the editor extension | Keep 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
| Pitfall | Why It Happens | Fix |
|---|---|---|
| The indentation changes | The Biome default is the tabs | The migration writes the explicit indentStyle |
The .gitignore is not respected | The VCS integration is disabled | Enable the vcs.useIgnoreFile |
| The known difference is missed | The review is skipped | Check the differences page |
| The editor still uses Prettier | The extension is not replaced | Set 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
| Item | Value |
|---|---|
| The command | biome migrate prettier --write |
| The input | The .prettierrc and the .prettierignore |
| The output | The biome.json with the explicit options |
| The defaults | The Biome defaults differ from Prettier’s |
| The VCS integration | Required for the .gitignore behavior |
| The known differences | The 3% of the intentional divergence |
| The post-migration | The review, the removal, the editor replacement |
Key takeaways:
- The command ports the Prettier options and the ignore patterns. The
biome migrate prettier --writereads the.prettierrcand the.prettierignore, and it writes the equivalent options into thebiome.json. The ignore patterns become thefiles.includesexceptions. - 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
.gitignorefiles by default, and Biome does so only when thevcs.useIgnoreFileis 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.
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!