Skip to content
Ultracite
Esc
↑↓navigate↵open⌘Jpreview
On this page

Migrate from Prettier

Replace standalone Prettier setup with Ultracite while preserving formatting expectations and aligning the rest of your linting stack.

If you’re already using Prettier and want to switch to Ultracite’s preconfigured setup, this guide will help you migrate while preserving your formatting standards.

Why Migrate to Ultracite?

  • Multiple Providers: Choose between Biome, ESLint + Prettier + Stylelint, or Oxlint
  • Zero Configuration: Ultracite provides highly configured presets for each provider
  • Editor Integration: Built-in support for AI-powered editors (Cursor, Windsurf, GitHub Copilot)
  • Consistent Workflow: Standardized setup across projects and teams
  • Maintained Rules: Regular updates with new best practices

Before You Start

Make sure you have:

  • An existing project using Prettier
  • Node.js 20.19+ (or 22.13+ on Node 22)
  • A Prettier configuration file (e.g., .prettierrc, prettier.config.js)

Migration Options

The fastest way is to run the automatic setup script.

npx ultracite init
pnpm dlx ultracite init
yarn dlx ultracite init
bunx ultracite init
nubx ultracite init
aube dlx ultracite init

This will:

  • Prompt you to choose a linting provider (Oxlint, Biome, or ESLint)
  • Install Ultracite and the necessary dependencies
  • Create your linter configuration from Ultracite’s presets (see below for what happens to your existing config)
  • Add check and fix scripts to package.json (an existing check or fix script that doesn’t run Ultracite is kept, with a warning)
  • Update your .vscode/settings.json in place, keeping your settings and comments (if you set up a VS Code-based editor)
  • Enable strictNullChecks in your tsconfig.json files, unless it’s already on (directly or through extends) or explicitly set to false, which init leaves alone with a warning
  • Set up editor integrations

If you switch to Biome or Oxlint (which have built-in formatters), Ultracite automatically removes the existing Prettier setup. This will:

  • Remove the ESLint, Prettier, and Stylelint packages Ultracite installs from devDependencies (anything in dependencies or peerDependencies, and plugins Ultracite doesn’t install, are left alone)
  • Remove any ESLint, Prettier, and Stylelint configuration files (including legacy .eslintrc* files) and the "prettier" and "stylelint" keys in package.json

Your .vscode/settings.json is merged rather than replaced, so settings for your previous tools (such as a default formatter) may remain; remove any that conflict with the new toolchain.

If you choose ESLint as your provider, Ultracite configures Prettier alongside ESLint with a config that builds on Ultracite’s Prettier preset. An ES module config is updated in place; a JSON, YAML, TOML, or CommonJS config, or a "prettier" key in package.json, is replaced by prettier.config.mjs. A config that doesn’t use Ultracite’s preset yet has its options replaced, and a warning names the file, so re-add anything you need. Once it spreads ultracite/prettier, re-running init keeps your own options and plugins. A config init can’t parse is left unchanged with a warning.

Option 2: Manual Migration

If you prefer more control over the process, follow the Setup steps and manually remove Prettier and its configuration files.

After the migration, restart your editor to ensure the new configuration is applied.

Was this page helpful?