Vite: Raise minimum supported version to 7

MIGRATION.md

@@ -56,6 +56,7 @@
   - [Core Changes and Removals](#core-changes-and-removals)
     - [Dropped support for legacy packages](#dropped-support-for-legacy-packages)
     - [Dropped support](#dropped-support)
+      - [Vite 5 and Vite 6](#vite-5-and-vite-6)
       - [Vite 4](#vite-4)
       - [TypeScript \< 4.9](#typescript--49)
       - [Node.js \< 20](#nodejs--20)
@@ -1216,6 +1217,44 @@ Additionally, we have deprecated the usage of `withActions` from `@storybook/add
 
 #### Dropped support
 
+##### Vite 5 and Vite 6
+
+Storybook 11.0 drops support for Vite 5 and Vite 6. The minimum supported version is now Vite 7.0.0. This change affects all Vite-based frameworks and builders:
+
+- `@storybook/builder-vite`
+- `@storybook/react-vite`
+- `@storybook/vue3-vite`
+- `@storybook/svelte-vite`
+- `@storybook/sveltekit`
+- `@storybook/web-components-vite`
+- `@storybook/preact-vite`
+- `@storybook/html-vite`
+- `@storybook/nextjs-vite`
+- `@storybook/react-native-web-vite`
+- `@storybook/tanstack-react`
+- `vite-plugin-storybook-nextjs`
+
+To upgrade:
+
+1. Update your project's Vite version to 7.0.0 or higher
+2. Update your Storybook configuration to use Vite 7:
+   ```js
+   // vite.config.js or vite.config.ts
+   export default {
+     // ... your other config
+     // Make sure you're using Vite 7 compatible plugins
+   };
+   ```
+
+If you're using framework-specific Vite plugins, ensure they are compatible with Vite 7:
+
+- `@vitejs/plugin-react`
+- `@vitejs/plugin-vue`
+- `@sveltejs/vite-plugin-svelte`
+- etc.
+
+For more information on upgrading to Vite 7, see the [Vite Migration Guide](https://vite.dev/guide/migration).
+
 ##### Vite 4
 
 Storybook 9.0 drops support for Vite 4. The minimum supported version is now Vite 5.0.0. This change affects all Vite-based frameworks and builders:

code/builders/builder-vite/package.json

@@ -62,7 +62,7 @@
   },
   "peerDependencies": {
     "storybook": "workspace:^",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "publishConfig": {
     "access": "public"

code/frameworks/html-vite/package.json

@@ -57,7 +57,7 @@
   },
   "peerDependencies": {
     "storybook": "workspace:^",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "publishConfig": {
     "access": "public"

code/frameworks/nextjs-vite/package.json

@@ -109,7 +109,7 @@
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "storybook": "workspace:^",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "peerDependenciesMeta": {
     "@types/react": {

code/frameworks/preact-vite/package.json

@@ -60,7 +60,7 @@
   "peerDependencies": {
     "preact": ">=10",
     "storybook": "workspace:^",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "publishConfig": {
     "access": "public"

code/frameworks/react-native-web-vite/package.json

@@ -67,7 +67,7 @@
     "react-native": ">=0.74.5",
     "react-native-web": "^0.19.12 || ^0.20.0 || ^0.21.0",
     "storybook": "workspace:^",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "publishConfig": {
     "access": "public"

code/frameworks/react-vite/package.json

@@ -72,7 +72,7 @@
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "storybook": "workspace:^",
     "typescript": ">= 4.9.x",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "peerDependenciesMeta": {
     "typescript": {

code/frameworks/svelte-vite/package.json

@@ -70,7 +70,7 @@
     "@sveltejs/vite-plugin-svelte": "^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0",
     "storybook": "workspace:^",
     "svelte": "^5.0.0",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "publishConfig": {
     "access": "public"

code/frameworks/sveltekit/package.json

@@ -69,7 +69,7 @@
   "peerDependencies": {
     "storybook": "workspace:^",
     "svelte": "^5.0.0",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "publishConfig": {
     "access": "public"

code/frameworks/tanstack-react/package.json

@@ -96,7 +96,7 @@
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "storybook": "workspace:^",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "peerDependenciesMeta": {
     "@tanstack/react-start": {

code/frameworks/vue3-vite/package.json

@@ -63,7 +63,7 @@
   "peerDependencies": {
     "storybook": "workspace:^",
     "typescript": ">= 4.9.x",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "peerDependenciesMeta": {
     "typescript": {

code/frameworks/web-components-vite/package.json

@@ -59,7 +59,7 @@
   },
   "peerDependencies": {
     "storybook": "workspace:^",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "publishConfig": {
     "access": "public"

code/lib/vite-plugin-storybook-nextjs/package.json

@@ -93,7 +93,7 @@
   "peerDependencies": {
     "next": "^14.1.0 || ^15.0.0 || ^16.0.0",
     "storybook": "workspace:^",
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "publishConfig": {
     "access": "public"

yarn.lock

@@ -12078,7 +12078,7 @@ __metadata:
     vite: "npm:^7.0.4"
   peerDependencies:
     storybook: "workspace:^"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   languageName: unknown
   linkType: soft
 
@@ -12374,7 +12374,7 @@ __metadata:
     typescript: "npm:^6.0.3"
   peerDependencies:
     storybook: "workspace:^"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   languageName: unknown
   linkType: soft
 
@@ -12441,7 +12441,7 @@ __metadata:
     react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
     react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
     storybook: "workspace:^"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   peerDependenciesMeta:
     "@types/react":
       optional: true
@@ -12532,7 +12532,7 @@ __metadata:
   peerDependencies:
     preact: ">=10"
     storybook: "workspace:^"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   languageName: unknown
   linkType: soft
 
@@ -12663,7 +12663,7 @@ __metadata:
     react-native: ">=0.74.5"
     react-native-web: ^0.19.12 || ^0.20.0 || ^0.21.0
     storybook: "workspace:^"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   languageName: unknown
   linkType: soft
 
@@ -12688,7 +12688,7 @@ __metadata:
     react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
     storybook: "workspace:^"
     typescript: ">= 4.9.x"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   peerDependenciesMeta:
     typescript:
       optional: true
@@ -12956,7 +12956,7 @@ __metadata:
     "@sveltejs/vite-plugin-svelte": ^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0
     storybook: "workspace:^"
     svelte: ^5.0.0
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   languageName: unknown
   linkType: soft
 
@@ -12992,7 +12992,7 @@ __metadata:
   peerDependencies:
     storybook: "workspace:^"
     svelte: ^5.0.0
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   languageName: unknown
   linkType: soft
 
@@ -13018,7 +13018,7 @@ __metadata:
     react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
     react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
     storybook: "workspace:^"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   peerDependenciesMeta:
     "@tanstack/react-start":
       optional: true
@@ -13042,7 +13042,7 @@ __metadata:
   peerDependencies:
     storybook: "workspace:^"
     typescript: ">= 4.9.x"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   peerDependenciesMeta:
     typescript:
       optional: true
@@ -13085,7 +13085,7 @@ __metadata:
     typescript: "npm:^6.0.3"
   peerDependencies:
     storybook: "workspace:^"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   languageName: unknown
   linkType: soft
 
@@ -39424,7 +39424,7 @@ __metadata:
   peerDependencies:
     next: ^14.1.0 || ^15.0.0 || ^16.0.0
     storybook: "workspace:^"
-    vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+    vite: ^7.0.0 || ^8.0.0
   languageName: unknown
   linkType: soft