Skip to content
Nx Docs

Upgrading Storybook

Nx provides migration support for major Storybook versions (8, 9, and 10). You can upgrade using Nx's built-in migration system or the Storybook CLI directly.

Upgrading with Nx

Section titled “Upgrading with Nx”

You can run a migration generator for the specific Storybook version you want to upgrade to, or starting with Nx 22, run nx migrate to automatically upgrade to Storybook 10.

Using migration generators

Section titled “Using migration generators”

Run the Storybook migration generator for your target version:

GeneratorCommandDescription
migrate-8nx g @nx/storybook:migrate-8Migrate to Storybook 8
migrate-9nx g @nx/storybook:migrate-9Migrate to Storybook 9
migrate-10nx g @nx/storybook:migrate-10Migrate to Storybook 10

Using nx migrate (Nx 22+)

Section titled “Using nx migrate (Nx 22+)”

Starting with Nx 22, when you run nx migrate, Nx automatically migrates Storybook 9 to Storybook 10. If you're already on Storybook 10, no migration runs. If you're on Storybook 8 or earlier, you'll need to use the migration generators above first.

Terminal window
nx migrate latest
nx migrate --run-migrations

AI-assisted migrations

Section titled “AI-assisted migrations”

For Storybook 10, some changes cannot be fully automated. When this happens, Nx generates an instructions file at ai-migrations/MIGRATE_STORYBOOK_10.md that an AI agent (Claude, ChatGPT, GitHub Copilot, etc.) can use to complete the migration.

For example, Storybook 10 requires configuration files to use ESM syntax instead of CommonJS. The AI migration instructions guide an agent to find and convert any CJS Storybook configs to ESM format.

Upgrading with Storybook CLI

Section titled “Upgrading with Storybook CLI”

If you prefer to skip Nx migrations and use the Storybook CLI directly:

Terminal window
npx storybook@latest upgrade

This runs Storybook's own upgrade command which updates dependencies and configuration files. See the Storybook upgrade documentation for more details.

After upgrading

Section titled “After upgrading”
  1. Review breaking changes in the Storybook release notes
  2. Update your stories to use new APIs if needed
  3. Test your Storybook instances to ensure everything works
  4. Update any custom configurations or addons

Troubleshooting

Section titled “Troubleshooting”

If you encounter issues:

  1. Check the Storybook migration guide for framework-specific changes
  2. Review the Nx Storybook documentation
  3. Report issues on the Nx GitHub or Storybook GitHub