### Describe the bug As you can see in https://github.com/storybookjs/storybook/tree/next/code/builders/builder-vite#L61 @storybook/builder-vite depends on rollup@"^2.25.0 || ^3.3.0". However, there is a new vite release out there: See https://vitejs.dev/blog/announcing-vite5 This comes with vite using rollup 4. In effect, this creates a situation, where rollup is dragged in in two different versions when using the storybook vite support. I only found the issue, when registering a unrelated rollup plugin in the vite.config.ts (@rollup/plugin-replace) and typescript being unhappy about that in my VS Code. I don't know about rollup/vite plugin internals to judge whether an update to "^2.25.0 || ^3.3.0|| ^ 4.0.0" plus new releases of @storybook/builder-vite and @storybook/vue3-vite would be all that is needed or whether the rollup update brought breaking changes that are relevant for @storybook/builder-vite and need to be handled manually. ### To Reproduce See: https://github.com/jfhumann/vite-rollup-replace-plugin-reproduction To reproduce, clone the repo, run npm install. If you run npm explain rollup, you will see the doubled rollup dependency: rollup@3.29.4 dev node_modules/rollup peerOptional rollup@"^1.20.0||^2.0.0||^3.0.0||^4.0.0" from @rollup/plugin-replace@5.0.5 node_modules/@rollup/plugin-replace dev @rollup/plugin-replace@"5.0.5" from the root project peerOptional rollup@"^1.20.0||^2.0.0||^3.0.0||^4.0.0" from @rollup/pluginutils@5.0.5 node_modules/@rollup/pluginutils @rollup/pluginutils@"^5.0.1" from @rollup/plugin-replace@5.0.5 node_modules/@rollup/plugin-replace dev @rollup/plugin-replace@"5.0.5" from the root project rollup@"^2.25.0 || ^3.3.0" from @storybook/builder-vite@7.6.0-alpha.4 node_modules/@storybook/builder-vite @storybook/builder-vite@"7.6.0-alpha.4" from @storybook/vue3-vite@7.6.0-alpha.4 node_modules/@storybook/vue3-vite dev @storybook/vue3-vite@"7.6.0-alpha.4" from the root project rollup@4.5.0 dev node_modules/vite/node_modules/rollup rollup@"^4.2.0" from vite@5.0.0 node_modules/vite dev vite@"5.0.0" from the root project peer vite@"^3.0.0 || ^4.0.0 || ^5.0.0" from @storybook/builder-vite@7.6.0-alpha.4 node_modules/@storybook/builder-vite @storybook/builder-vite@"7.6.0-alpha.4" from @storybook/vue3-vite@7.6.0-alpha.4 node_modules/@storybook/vue3-vite dev @storybook/vue3-vite@"7.6.0-alpha.4" from the root project peer vite@"^3.0.0 || ^4.0.0 || ^5.0.0" from @storybook/vue3-vite@7.6.0-alpha.4 node_modules/@storybook/vue3-vite dev @storybook/vue3-vite@"7.6.0-alpha.4" from the root project peer vite@"^4.0.0 || ^5.0.0" from @vitejs/plugin-vue@4.5.0 node_modules/@vitejs/plugin-vue @vitejs/plugin-vue@"^4.0.0" from @storybook/vue3-vite@7.6.0-alpha.4 node_modules/@storybook/vue3-vite dev @storybook/vue3-vite@"7.6.0-alpha.4" from the root project If you open the project with VS Code and open vite.config.ts, you will see the following error where the replace plugin is used that seems to stem from the two versions of the rollup dependencies: No overload matches this call. The last overload gave the following error. Type 'Plugin' is not assignable to type 'PluginOption'. Type 'import("c:/Workspaces/tmp/vite-rollup-replace-plugin-reproduction/node_modules/rollup/dist/rollup").Plugin' is not assignable to type 'import("c:/Workspaces/tmp/vite-rollup-replace-plugin-reproduction/node_modules/vite/dist/node/index").Plugin'. Types of property 'resolveId' are incompatible. Type 'ObjectHook<(this: PluginContext, source: string, importer: string | undefined, options: { assertions: Record; custom?: CustomPluginOptions | undefined; isEntry: boolean; }) => ResolveIdResult | Promise<...>, {}> | undefined' is not assignable to type 'ObjectHook<(this: PluginContext, source: string, importer: string | undefined, options: { attributes: Record; custom?: CustomPluginOptions | undefined; ssr?: boolean | undefined; isEntry: boolean; }) => ResolveIdResult | Promise<...>> | undefined'. Type '(this: PluginContext, source: string, importer: string | undefined, options: { assertions: Record; custom?: CustomPluginOptions | undefined; isEntry: boolean; }) => ResolveIdResult | Promise<...>' is not assignable to type 'ObjectHook<(this: PluginContext, source: string, importer: string | undefined, options: { attributes: Record; custom?: CustomPluginOptions | undefined; ssr?: boolean | undefined; isEntry: boolean; }) => ResolveIdResult | Promise<...>> | undefined'. Type '(this: PluginContext, source: string, importer: string | undefined, options: { assertions: Record; custom?: CustomPluginOptions | undefined; isEntry: boolean; }) => ResolveIdResult | Promise<...>' is not assignable to type '(this: PluginContext, source: string, importer: string | undefined, options: { attributes: Record; custom?: CustomPluginOptions | undefined; ssr?: boolean | undefined; isEntry: boolean; }) => ResolveIdResult | Promise<...>'. The 'this' types of each signature are incompatible. Property 'moduleIds' is missing in type 'import("c:/Workspaces/tmp/vite-rollup-replace-plugin-reproduction/node_modules/vite/node_modules/rollup/dist/rollup").PluginContext' but required in type 'import("c:/Workspaces/tmp/vite-rollup-replace-plugin-reproduction/node_modules/rollup/dist/rollup").PluginContext'.ts(2769) rollup.d.ts(223, 2): 'moduleIds' is declared here. index.d.ts(3000, 18): The last overload is declared here. ### System ```bash Storybook Environment Info: System: OS: Windows 11 10.0.22621 CPU: (16) x64 11th Gen Intel(R) Core(TM) i7-11850H @ 2.50GHz Binaries: Node: 20.9.0 - C:\Program Files\nodejs\node.EXE Yarn: 1.22.21 - C:\Program Files\nodejs\yarn.CMD npm: 10.2.3 - C:\Program Files\nodejs\npm.CMD <----- active Browsers: Edge: Chromium (118.0.2088.76) npmPackages: @storybook/vue3-vite: 7.6.0-alpha.4 => 7.6.0-alpha.4 ``` ### Additional context _No response_

[Bug]: @storybook/builder-vite (and therefore @storybook/vue3-vite) does not support rollup 4 (vite 5) #24918

Company

Community

Support

Connect