Merge pull request #25952 from storybookjs/tom/add-stats-migration-note

Docs: Add migration note about TS/stats and link to it

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,

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",

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]);
   }
 

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: