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

Migrate from Stylelint

Replace standalone Stylelint setup with Ultracite while keeping CSS linting standards aligned with the rest of your frontend tooling.

If you’re already using Stylelint and want to switch to Ultracite’s preconfigured setup, this guide will help you migrate while preserving your styling 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 Stylelint
  • Node.js 20.19+ (or 22.13+ on Node 22)
  • A Stylelint configuration file (e.g., .stylelintrc, stylelint.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, Ultracite automatically removes the existing Stylelint configuration. Biome lints CSS itself, but Oxlint doesn’t lint CSS at all (Oxfmt only formats it), so pick Biome or ESLint + Prettier + Stylelint if you still need CSS linting. Switching 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 Stylelint alongside ESLint with a stylelint.config.mjs that re-exports Ultracite’s config. An existing config that doesn’t reference ultracite/stylelint is replaced (JSON, YAML, and CommonJS configs, and a "stylelint" key in package.json, move to stylelint.config.mjs), and a warning names the file so you can re-add your own rules. A config that already references ultracite/stylelint, for example one that extends it and adds rules, is left as it is.

Option 2: Manual Migration

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

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

Was this page helpful?