Reproduction of using node_modules server components with client component inside of it

[kasperpeulen]

We export the following component in storybook:

import { NextRouter } from '@storybook/nextjs-vite-rsc/rsc/client' 

Which can be used inside of server components of the user.
But somehow, if it is used in server components inside of node_modules it breaks.

For example, this is the content of @storybook/nextjs-vite-rsc/repro

import React from 'react'; import { NextRouter } from '@storybook/nextjs-vite-rsc/rsc/client'; export const ServerComponent = ({ children }) => ( <NextRouter>{children}</NextRouter> );

This breaks, and I get error messages that the NextRouter is being loaded on the server:

chunk-3RVVKXLG.js?v=734aac02:52 Uncaught TypeError: _react.default.createContext is not a function at ../../../../node_modules/.pnpm/next@15.5.4_@playwright+test@1.55.1_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/next/dist/shared/lib/app-router-context.shared-runtime.js (chunk-3RVVKXLG.js?v=734aac02:52:43) at __require (chunk-5WRI5ZAA.js?v=734aac02:8:50) at ../../../../node_modules/.pnpm/next@15.5.4_@playwright+test@1.55.1_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/next/dist/client/components/app-router.js (chunk-CEJIVGUO.js?v=734aac02:29789:42) at __require (chunk-5WRI5ZAA.js?v=734aac02:8:50) at ../../../../node_modules/.pnpm/next@15.5.4_@playwright+test@1.55.1_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/next/dist/client/components/router-reducer/reducers/navigate-reducer.js (chunk-CEJIVGUO.js?v=734aac02:30503:22) at __require (chunk-5WRI5ZAA.js?v=734aac02:8:50) at ../../../../node_modules/.pnpm/next@15.5.4_@playwright+test@1.55.1_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/next/dist/client/components/router-reducer/router-reducer.js (chunk-CEJIVGUO.js?v=734aac02:31556:28) at __require (chunk-5WRI5ZAA.js?v=734aac02:8:50) at ../../../../node_modules/.pnpm/next@15.5.4_@playwright+test@1.55.1_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/next/dist/client/components/app-router-instance.js (chunk-CEJIVGUO.js?v=734aac02:31638:26) at __require (chunk-5WRI5ZAA.js?v=734aac02:8:50) 

[hi-ogawa]

This is likely because client environment tries to optimize (pre-bundle) package, but "use client" is not supported there. "Vite framework package" (not specifically rsc) is expected to be like optimizeDeps.exclude: ['@storybook/nextjs-vite-rsc'], for example, we also exclude @vitejs/plugin-rsc (here PKG_NAME)

vite-plugin-react/packages/plugin-rsc/src/plugin.ts

Lines 380 to 386 in 5e245aa

	optimizeDeps: {
	include: [
	'react-dom/client',
	`${REACT_SERVER_DOM_NAME}/client.browser`,
	],
	exclude: [PKG_NAME],
	},