From 4780ae31030197488d66b4fba483867f416bdb0a Mon Sep 17 00:00:00 2001 From: Kyle Gach Date: Thu, 7 Mar 2024 11:12:25 -0700 Subject: [PATCH 1/4] Add section about missing vite config file --- docs/migration-guide/from-older-version.md | 4 ++++ docs/migration-guide/index.md | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/docs/migration-guide/from-older-version.md b/docs/migration-guide/from-older-version.md index b3740aa2f854..89e290bb0216 100644 --- a/docs/migration-guide/from-older-version.md +++ b/docs/migration-guide/from-older-version.md @@ -79,6 +79,10 @@ If you are using the `storiesOf` API (which requires `storyStoreV7: false` in St Storybook 8 uses MDX 3. If you're coming from MDX 1 (used by Storybook 6), there were significant breaking changes in MDX 2. Please reference our [guidance on upgrading successfully](../../release-7-6/docs/migration-guide.md#upgrade-mdx1-to-mdx2). +#### Missing `vite.config.js` file + +If you are using Vite, you may now need to create a `vite.config.js` file in your project root to allow newer versions of Vite to work with Storybook. Additionally, you may need to install and configure a Vite plugin for your framework. More information is available in the [full migration notes](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#framework-specific-vite-plugins-have-to-be-explicitly-added). + ## Troubleshooting The automatic upgrade should get your Storybook into a working state. If you encounter an error running Storybook after upgrading, here’s what to do: diff --git a/docs/migration-guide/index.md b/docs/migration-guide/index.md index 3ecf74ddfb57..314a90807140 100644 --- a/docs/migration-guide/index.md +++ b/docs/migration-guide/index.md @@ -79,6 +79,10 @@ If you have `storyStoreV7: false` in your `.storybook/main.js`, you will need to If you are using the `storiesOf` API (which requires `storyStoreV7: false` in Storybook 7), you will need to either [migrate your stories to CSF](../../release-7-6/docs/migration-guide.md#storiesof-to-csf) or use the [new indexer API to continue creating stories dynamically](../../release-7-6/docs/migration-guide.md#storiesof-to-dynamically-created-stories). +#### Missing `vite.config.js` file + +If you are using Vite, you may now need to create a `vite.config.js` file in your project root to allow newer versions of Vite to work with Storybook. Additionally, you may need to install and configure a Vite plugin for your framework. More information is available in the [full migration notes](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#framework-specific-vite-plugins-have-to-be-explicitly-added). + ## New projects To add Storybook to a project that isn’t currently using Storybook: From c5503309b92ed4fd55aa3081b24e6bd9bc824bc0 Mon Sep 17 00:00:00 2001 From: Joe Vaughan <122215197+joevaugh4n@users.noreply.github.com> Date: Thu, 7 Mar 2024 18:45:17 +0000 Subject: [PATCH 2/4] Docs: update index.md Changed the feature list --- docs/migration-guide/index.md | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/docs/migration-guide/index.md b/docs/migration-guide/index.md index 314a90807140..db216a58cf4b 100644 --- a/docs/migration-guide/index.md +++ b/docs/migration-guide/index.md @@ -1,12 +1,17 @@ --- -title: 'Migration guide for Storybook 8.0' +title: 'Migration guide from Storybook 6.x to 8.0' --- -Storybook 8 focuses on performance and stability. +Storybook 8 focuses on improving performance, compatibility, and stability. Key features include: +- 🩻 A new visual testing workflow via [the Visual Tests addon](https://www.chromatic.com/docs/visual-tests-addon/) - 💨 [2-4x faster test builds](https://storybook.js.org/blog/optimize-storybook-7-6/#2-4x-faster-builds-with-thetest-flag), [25-50% faster React docgen](https://storybook.js.org/blog/optimize-storybook-7-6/#22x-faster-react-docgen), and [SWC support for Webpack projects](https://storybook.js.org/blog/optimize-storybook-7-6/#using-webpack-enable-swc) -- ✨ Improved framework support: you no longer need to install React as a peer dependency when using a non-React renderer +- 🧩 Improved framework support: you no longer need to install React as a peer dependency when using a non-React renderer +- 🎛️ Strengthened control generation in [React](https://storybook.js.org/blog/storybook-8-beta/#major-performance-improvements +) and [Vue](https://storybook.js.org/blog/first-class-vue-support-storybook-8/) projects +- ⚡️ Improved Vite architecture, Vitest testing, and Vite 5 support - 🌐 [Support for React Server Components (RSC)](https://storybook.js.org/blog/storybook-react-server-components/): our experimental solution renders async RSC in the browser and mocks Node code +- ✨ A refreshed desktop UI & mobile UX - ➕ Much, much more This guide is meant to help you **upgrade from Storybook 7.x to 8.0** successfully! From 9eea0d4a5a3e0c91558ec76d5c438450ab4de6bc Mon Sep 17 00:00:00 2001 From: Joe Vaughan <122215197+joevaugh4n@users.noreply.github.com> Date: Thu, 7 Mar 2024 18:45:40 +0000 Subject: [PATCH 3/4] Update index.md fixed title change --- docs/migration-guide/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/migration-guide/index.md b/docs/migration-guide/index.md index db216a58cf4b..51962ca7b88d 100644 --- a/docs/migration-guide/index.md +++ b/docs/migration-guide/index.md @@ -1,5 +1,5 @@ --- -title: 'Migration guide from Storybook 6.x to 8.0' +title: 'Migration guide for Storybook 8.0' --- Storybook 8 focuses on improving performance, compatibility, and stability. Key features include: From c2be62fd8dccfcb0adb5c6e09e48f6a441af077f Mon Sep 17 00:00:00 2001 From: Joe Vaughan <122215197+joevaugh4n@users.noreply.github.com> Date: Thu, 7 Mar 2024 18:46:27 +0000 Subject: [PATCH 4/4] Update from-older-version.md updated feature list --- docs/migration-guide/from-older-version.md | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/docs/migration-guide/from-older-version.md b/docs/migration-guide/from-older-version.md index 89e290bb0216..c368c48e39be 100644 --- a/docs/migration-guide/from-older-version.md +++ b/docs/migration-guide/from-older-version.md @@ -2,11 +2,16 @@ title: 'Migration guide from Storybook 6.x to 8.0' --- -Storybook 8 focuses on performance and stability. - -- 💨 [2-4x faster test builds](/blog/optimize-storybook-7-6/#2-4x-faster-builds-with-thetest-flag), [25-50% faster React docgen](/blog/optimize-storybook-7-6/#22x-faster-react-docgen), and [SWC support for Webpack projects](/blog/optimize-storybook-7-6/#using-webpack-enable-swc) -- ✨ Improved framework support: you no longer need to install React as a peer dependency when using a non-React renderer -- 🌐 [Support for React Server Components (RSC)](/blog/storybook-react-server-components/): our experimental solution renders async RSC in the browser and mocks Node code +Storybook 8 focuses on improving performance, compatibility, and stability. Key features include: + +- 🩻 A new visual testing workflow via [the Visual Tests addon](https://www.chromatic.com/docs/visual-tests-addon/) +- 💨 [2-4x faster test builds](https://storybook.js.org/blog/optimize-storybook-7-6/#2-4x-faster-builds-with-thetest-flag), [25-50% faster React docgen](https://storybook.js.org/blog/optimize-storybook-7-6/#22x-faster-react-docgen), and [SWC support for Webpack projects](https://storybook.js.org/blog/optimize-storybook-7-6/#using-webpack-enable-swc) +- 🧩 Improved framework support: you no longer need to install React as a peer dependency when using a non-React renderer +- 🎛️ Strengthened control generation in [React](https://storybook.js.org/blog/storybook-8-beta/#major-performance-improvements +) and [Vue](https://storybook.js.org/blog/first-class-vue-support-storybook-8/) projects +- ⚡️ Improved Vite architecture, Vitest testing, and Vite 5 support +- 🌐 [Support for React Server Components (RSC)](https://storybook.js.org/blog/storybook-react-server-components/): our experimental solution renders async RSC in the browser and mocks Node code +- ✨ A refreshed desktop UI & mobile UX - ➕ Much, much more This guide is meant to help you **upgrade from Storybook 6.x to 8.0** successfully!