Reproduction of using next/link in build mode

packages/plugin-rsc/examples/browser-mode/package.json

@@ -5,13 +5,16 @@
   "license": "MIT",
   "type": "module",
   "scripts": {
-    "dev": "vite",
+    "dev": "rm -rf ./node_modules/.vite && vite",
     "build": "vite build",
     "preview": "vite preview"
   },
   "dependencies": {
+    "@storybook/nextjs-vite-rsc": "0.0.0-pr-32412-sha-b8362176",
+    "storybook": "0.0.0-pr-32412-sha-b8362176",
     "react": "^19.1.1",
-    "react-dom": "^19.1.1"
+    "react-dom": "^19.1.1",
+    "next": "^15.5.4"
   },
   "devDependencies": {
     "@types/react": "^19.1.16",

packages/plugin-rsc/examples/browser-mode/src/client.tsx

@@ -1,13 +1,16 @@
 'use client'
 
 import React from 'react'
+import { usePathname } from 'next/navigation'
 
 export function ClientCounter() {
+  const pathname = usePathname()
   const [count, setCount] = React.useState(0)
 
   return (
     <button onClick={() => setCount((count) => count + 1)}>
-      Client Counter: {count}
+      Client Counter: {count} <br />
+      Injected pathname: {pathname}
     </button>
   )
 }

packages/plugin-rsc/examples/browser-mode/src/root.tsx

@@ -6,17 +6,33 @@ import { ClientCounter } from './client.tsx'
 import { TestUseActionState } from './action-from-client/client.tsx'
 import { TestActionBind } from './action-bind/server.tsx'
 
+// using the client component directly works
+import { NextRouter } from '@storybook/nextjs-vite-rsc/rsc/client'
+import Link from 'next/link'
+
 export function Root() {
-  return <App />
+  return (
+    <NextRouter url="/some-path-name">
+      <App />
+    </NextRouter>
+  )
+}
+
+export function WorkingRoot() {
+  return (
+    <NextRouter url="/some-path-name">
+      <App />
+    </NextRouter>
+  )
 }
 
 function App() {
   return (
     <div id="root">
       <div>
-        <a href="https://vite.dev" target="_blank">
+        <Link href="https://vite.dev" target="_blank">
           <img src={viteLogo} className="logo" alt="Vite logo" />
-        </a>
+        </Link>
         <a
           href="https://react.dev/reference/rsc/server-components"
           target="_blank"

packages/plugin-rsc/examples/browser-mode/vite.config.ts

@@ -4,6 +4,7 @@ import {
   getPluginApi,
   type PluginApi,
 } from '@vitejs/plugin-rsc/plugin'
+import * as path from 'node:path'
 // import inspect from 'vite-plugin-inspect'
 
 export default defineConfig({
@@ -35,10 +36,26 @@ function rscBrowserModePlugin(): Plugin[] {
       config(userConfig, env) {
         return {
           define: {
+            'process.env': JSON.stringify({}),
+            __dirname: JSON.stringify(null),
             'import.meta.env.__vite_rsc_build__': JSON.stringify(
               env.command === 'build',
             ),
           },
+          resolve: {
+            alias: {
+              // when using the app router, this is the location of next/link
+              'next/link': 'next/dist/client/app-dir/link',
+              '@vercel/turbopack-ecmascript-runtime/browser/dev/hmr-client/hmr-client.ts':
+                'next/dist/client/dev/noop-turbopack-hmr',
+              'react-server-dom-webpack/client': path.resolve(
+                '../../dist/vendor/react-server-dom/client.edge.js',
+              ),
+              'react-server-dom-webpack/client.edge': path.resolve(
+                '../../dist/vendor/react-server-dom/client.edge.js',
+              ),
+            },
+          },
           environments: {
             client: {
               keepProcessEnv: false,
@@ -52,8 +69,10 @@ function rscBrowserModePlugin(): Plugin[] {
                   'react-dom/client',
                   'react/jsx-runtime',
                   'react/jsx-dev-runtime',
+                  'next/link',
                   '@vitejs/plugin-rsc/vendor/react-server-dom/server.edge',
                   '@vitejs/plugin-rsc/vendor/react-server-dom/client.edge',
+                  '@storybook/nextjs-vite-rsc/rsc/client',
                 ],
                 exclude: ['vite', '@vitejs/plugin-rsc'],
               },
@@ -74,7 +93,10 @@ function rscBrowserModePlugin(): Plugin[] {
                   'react-dom/client',
                   'react/jsx-runtime',
                   'react/jsx-dev-runtime',
+                  'next/link',
                   '@vitejs/plugin-rsc/vendor/react-server-dom/client.browser',
+                  '@storybook/nextjs-vite-rsc/rsc/client',
+                  'next/navigation',
                 ],
                 exclude: ['@vitejs/plugin-rsc'],
                 esbuildOptions: {
@@ -161,6 +183,9 @@ function rscBrowserModePlugin(): Plugin[] {
         manager.isScanBuild = true
         reactServer.config.build.write = false
         await builder.build(reactServer)
+        // For some reason I sometimes need to build the reactServer twice before I can build the reactClient.
+        // Will also make a more dedicated reproduction for that.
+        await builder.build(reactServer)
         manager.isScanBuild = false
         reactServer.config.build.write = true
         await builder.build(reactClient)

packages/plugin-rsc/src/plugin.ts

@@ -267,6 +267,7 @@ export function vitePluginRscMinimal(
     ...vitePluginUseServer(rscPluginOptions, manager),
     ...vitePluginDefineEncryptionKey(rscPluginOptions),
     scanBuildStripPlugin({ manager }),
+    ...cjsModuleRunnerPlugin(),
   ]
 }