Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CLI: Add Next.js framework automigration #19574

Merged
merged 6 commits into from
Dec 14, 2022
Merged

CLI: Add Next.js framework automigration #19574

merged 6 commits into from
Dec 14, 2022

Conversation

yannbf
Copy link
Member

@yannbf yannbf commented Oct 21, 2022

Issue: N/A

What I did

This adds an automigration for projects using @storybook/react-webpack5 and Next.js, so they can use the new @storybook/nextjs package instead.

image

For @storybook/react-vite and Next.js users, it will warn them, but not migrate anything:
image

TODO:

How to test

  1. Bootstrap the project and build the CLI
  2. Run sb automigrate in a React Webpack5 + Next.js project
  • Is this testable with Jest or Chromatic screenshots?
  • Does this need a new example in the kitchen sink apps?
  • Does this need an update to the documentation?

If your answer is yes to any of these, please make sure to include it in your PR.

Base automatically changed from nextjs-framework-add-to-ci to next October 21, 2022 15:05
return null;
}

// we only migrate from react-webpack5 projects
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Given that @storybook/react-webpack5 is only available in 7.0+, It seems far more likely that someone would be upgrading from a project with @storybook/react & @storybook/builder-webpack5. Perhaps, for this scenario, we could leverage the fix tested here, and then re-run this fix?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This would happen after another migration that would have migrated users to react-webpack5

This package provides a better experience for Next.js users, however it is only compatible with the webpack 5 builder, so we can't automigrate for you, as you are using the Vite builder.

If you are interested in using this package, see: ${chalk.yellow(
'https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#nextjs-framework'
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's just point them to the framework README. I don't think that info belongs in the migration guide.

@yannbf yannbf mentioned this pull request Dec 2, 2022
2 tasks
@shilman shilman changed the title CLI: add Next.js framework automigration CLI: Add Next.js framework automigration Dec 8, 2022
@shilman
Copy link
Member

shilman commented Dec 8, 2022

Decided to leave this until after the post has gone out & somebody has time to properly test it

Copy link
Member

@shilman shilman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@yannbf we didn't feel comfortable doing a last-minute merge on this before the post went out. changes LGTM so if you want to merge & release now that you're back from vacation that WFM

@JReinhold
Copy link
Contributor

I based the SvelteKit automigration on this work, with some modifications. Feel free to be inspired or ignore it.

https://github.com/storybookjs/storybook/tree/next/code/lib/cli/src/automigrate/fixes/sveltekit-framework.ts

@shilman shilman merged commit 2d952bd into next Dec 14, 2022
@shilman shilman deleted the nextjs-automigration branch December 14, 2022 00:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

None yet

4 participants