diff --git a/MIGRATION.md b/MIGRATION.md index 15b17681953b..562b6566d532 100644 --- a/MIGRATION.md +++ b/MIGRATION.md @@ -7,6 +7,7 @@ - [Removal of `storiesOf`-API](#removal-of-storiesof-api) - [Removed deprecated shim packages](#removed-deprecated-shim-packages) - [Framework-specific Vite plugins have to be explicitly added](#framework-specific-vite-plugins-have-to-be-explicitly-added) + - [TurboSnap Vite plugin is no longer needed](#turbosnap-vite-plugin-is-no-longer-needed) - [Implicit actions can not be used during rendering (for example in the play function)](#implicit-actions-can-not-be-used-during-rendering-for-example-in-the-play-function) - [MDX related changes](#mdx-related-changes) - [MDX is upgraded to v3](#mdx-is-upgraded-to-v3) @@ -460,6 +461,12 @@ export default defineConfig({ }); ``` +### TurboSnap Vite plugin is no longer needed + +At least in build mode, `builder-vite` now supports the `--webpack-stats-json` flag and will output `preview-stats.json`. + +This means https://github.com/IanVS/vite-plugin-turbosnap is no longer necessary, and duplicative, and the plugin will automatically be removed if found. + ### Implicit actions can not be used during rendering (for example in the play function) In Storybook 7, we inferred if the component accepts any action props, diff --git a/code/builders/builder-vite/package.json b/code/builders/builder-vite/package.json index 819b73ee6eb6..f87231f5195d 100644 --- a/code/builders/builder-vite/package.json +++ b/code/builders/builder-vite/package.json @@ -57,7 +57,8 @@ "express": "^4.17.3", "find-cache-dir": "^3.0.0", "fs-extra": "^11.1.0", - "magic-string": "^0.30.0" + "magic-string": "^0.30.0", + "ts-dedent": "^2.0.0" }, "devDependencies": { "@types/express": "^4.17.13", diff --git a/code/builders/builder-vite/src/build.ts b/code/builders/builder-vite/src/build.ts index 31a2e6f62558..ebf4f030e8b8 100644 --- a/code/builders/builder-vite/src/build.ts +++ b/code/builders/builder-vite/src/build.ts @@ -1,10 +1,11 @@ import type { Options } from '@storybook/types'; -import { commonConfig } from './vite-config'; +import { logger } from '@storybook/node-logger'; +import dedent from 'ts-dedent'; +import { commonConfig } from './vite-config'; import { sanitizeEnvVars } from './envs'; import type { WebpackStatsPlugin } from './plugins'; import type { InlineConfig } from 'vite'; -import { logger } from '@storybook/node-logger'; import { hasVitePlugins } from './utils/has-vite-plugins'; import { withoutVitePlugins } from './utils/without-vite-plugins'; @@ -42,10 +43,11 @@ export async function build(options: Options) { const hasTurbosnapPlugin = finalConfig.plugins && hasVitePlugins(finalConfig.plugins, [turbosnapPluginName]); if (hasTurbosnapPlugin) { - logger.warn(`Found '${turbosnapPluginName}' which is now included by default in Storybook 8.`); - logger.warn( - `Removing from your plugins list. Ensure you pass \`--webpack-stats-json\` to generate stats.` - ); + logger.warn(dedent`Found '${turbosnapPluginName}' which is now included by default in Storybook 8. + Removing from your plugins list. Ensure you pass \`--webpack-stats-json\` to generate stats. + + For more information, see https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#turbosnap-vite-plugin-is-no-longer-needed`); + finalConfig.plugins = await withoutVitePlugins(finalConfig.plugins, [turbosnapPluginName]); } diff --git a/code/yarn.lock b/code/yarn.lock index 343ef7678941..755a51216c17 100644 --- a/code/yarn.lock +++ b/code/yarn.lock @@ -5267,6 +5267,7 @@ __metadata: glob: "npm:^10.0.0" magic-string: "npm:^0.30.0" slash: "npm:^5.0.0" + ts-dedent: "npm:^2.0.0" typescript: "npm:^5.3.2" vite: "npm:^4.0.4" peerDependencies: