Error: react-dom/server is not supported in React Server Components.

[eashish93]

I can reproduce this on vinext 0.0.50 with @react-email/render@1.4.0 and React 19.2.6.

Root cause appears to be that @react-email/render's workerd/edge entry dynamically imports react-dom/server.edge, but vinext resolves that import under the react-server condition inside an App Route handler. React then resolves react-dom/server.edge to react-dom/server.react-server.js, which throws:

react-dom/server is not supported in React Server Components.

A local workaround is:

// vite.config.ts
resolve: {
  alias: [
    {
      find: 'react-dom/server.edge',
      replacement: path.resolve(__dirname, 'node_modules/react-dom/server.edge.js'),
    },
  ],
}

[eashish93]

Update — the alias workaround above is incomplete. I verified this against a fresh repro on vinext@0.0.50.

Aliasing react-dom/server.edge → absolute path gets past the outer server.react-server.js throw, but the inner require('react') inside react-dom/cjs/react-dom-server.edge.development.js:8817 is still resolved by the RSC env's resolver with the react-server condition. It picks the react-server variant of react, which exports __SERVER_INTERNALS_… instead of __CLIENT_INTERNALS_…. Then at line 9533 ReactSharedInternals is undefined, and the next write throws:

TypeError: Cannot set properties of undefined (setting 'recentlyCreatedOwnerStacks')
    at resetOwnerStackLimit (react-dom/cjs/react-dom-server.edge.development.js:4534:32)
    at render (@react-email/render/src/edge/render.tsx:18:22)
    at sendTemplatedEmail (lib/email.ts:23:26)

(Same root cause, different symptom than the original server is not supported in React Server Components error — it surfaces depending on whether the optimizer happened to already cache an optimized server.edge or not.)

---

Actual working workaround

The clean fix is to load App Route handlers in the SSR env instead of the RSC env, so react-dom/server.edge resolution doesn't pick up the react-server condition. The SSR entry statically imports each route module and exposes a loadAppRouteHandler(pattern) lookup; the patched RSC dispatcher fetches the handler via import.meta.viteRsc.loadModule(\"ssr\", \"index\") before invoking it.

Verified end-to-end against vinext@0.0.50:

• GET /api/test-email-fix → @react-email/render renders the template successfully.
• With `"remote": true` on the EMAIL binding, the welcome email lands in the inbox via Cloudflare Email Sending.
• No recentlyCreatedOwnerStacks error, no react-dom/server is not supported error.

patches/vinext@0.0.50.patch:

diff --git a/dist/entries/app-rsc-entry.js b/dist/entries/app-rsc-entry.js
--- a/dist/entries/app-rsc-entry.js
+++ b/dist/entries/app-rsc-entry.js
@@ -471,7 +471,7 @@ export default __createAppRscHandler({
       renderMode,
     });
   },
-  dispatchMatchedRouteHandler({
+  async dispatchMatchedRouteHandler({
     cleanPathname,
     middlewareContext,
     params,
@@ -479,6 +479,11 @@ export default __createAppRscHandler({
     route,
     searchParams,
   }) {
+    const __ssrEntry = await import.meta.viteRsc.loadModule(\"ssr\", \"index\");
+    const __routeHandler = __ssrEntry.loadAppRouteHandler?.(route.pattern);
+    if (!__routeHandler) {
+      throw new Error(\"[vinext] Failed to load app route handler for \" + route.pattern + \" from the SSR environment.\");
+    }
     return __dispatchAppRouteHandler({
       basePath: __basePath,
       cleanPathname,
@@ -496,7 +501,7 @@ export default __createAppRscHandler({
       request,
       route: {
         pattern: route.pattern,
-        routeHandler: route.routeHandler,
+        routeHandler: __routeHandler,
         routeSegments: route.routeSegments,
       },
       scheduleBackgroundRegeneration: __triggerBackgroundRegeneration,
diff --git a/dist/entries/app-rsc-manifest.js b/dist/entries/app-rsc-manifest.js
--- a/dist/entries/app-rsc-manifest.js
+++ b/dist/entries/app-rsc-manifest.js
@@ -22,7 +22,6 @@ function createImportAllocator() {
 function registerRouteModules(routes, imports) {
 	for (const route of routes) {
 		if (route.pagePath) imports.getImportVar(route.pagePath);
-		if (route.routePath) imports.getImportVar(route.routePath);
 		for (const layout of route.layouts) imports.getImportVar(layout);
 		for (const tmpl of route.templates) imports.getImportVar(tmpl);
 		if (route.loadingPath) imports.getImportVar(route.loadingPath);
@@ -100,7 +99,7 @@ ${interceptEntries.join(\",\\\\n\")}
     params: ${JSON.stringify(route.params)},
     rootParamNames: ${JSON.stringify(route.rootParamNames ?? [])},
     page: ${route.pagePath ? imports.getImportVar(route.pagePath) : \"null\"},
-    routeHandler: ${route.routePath ? imports.getImportVar(route.routePath) : \"null\"},
+    routeHandler: ${route.routePath ? \"true\" : \"null\"},
     layouts: [${layoutVars.join(\", \")}],
     routeSegments: ${JSON.stringify(route.routeSegments)},
     templateTreePositions: ${JSON.stringify(route.templateTreePositions)},
diff --git a/dist/entries/app-ssr-entry.js b/dist/entries/app-ssr-entry.js
--- a/dist/entries/app-ssr-entry.js
+++ b/dist/entries/app-ssr-entry.js
@@ -1,4 +1,4 @@
-import { resolveRuntimeEntryModule } from \"./runtime-entry-module.js\";
+import { normalizePathSeparators, resolveRuntimeEntryModule } from \"./runtime-entry-module.js\";
 //#region src/entries/app-ssr-entry.ts
 /**
 * Generate the virtual SSR entry module.
@@ -11,11 +11,27 @@ import { resolveRuntimeEntryModule } from \"./runtime-entry-module.js\";
 * that the Cloudflare Workers RSC bundle can access Pages Router route
 * metadata (including \`getStaticPaths\`) via \`import(\"./ssr/index.js\")\`.
 */
-function generateSsrEntry(hasPagesDir = false) {
+function generateSsrEntry(routes = [], hasPagesDir = false) {
 	const entryPath = resolveRuntimeEntryModule(\"app-ssr-entry\");
+	const routeHandlerImports = [];
+	const routeHandlerEntries = [];
+	let routeHandlerIndex = 0;
+	for (const route of routes) {
+		if (!route.routePath) continue;
+		const routeHandlerVar = \`__appRouteHandler_${routeHandlerIndex++}\`;
+		routeHandlerImports.push(\`import * as ${routeHandlerVar} from ${JSON.stringify(normalizePathSeparators(route.routePath))};\`);
+		routeHandlerEntries.push(\`  ${JSON.stringify(route.pattern)}: ${routeHandlerVar},\`);
+	}
 	return \`
+${routeHandlerImports.join(\"\\\\n\")}
 export * from ${JSON.stringify(entryPath)};
 export { default } from ${JSON.stringify(entryPath)};
+const __appRouteHandlers = {
+${routeHandlerEntries.join(\"\\\\n\")}
+};
+export function loadAppRouteHandler(pattern) {
+  return __appRouteHandlers[pattern] ?? null;
+}
 ${hasPagesDir ? \`
 export { pageRoutes, renderPage } from \"virtual:vinext-server-entry\";
 \` : \"\"}\`;
diff --git a/dist/index.js b/dist/index.js
--- a/dist/index.js
+++ b/dist/index.js
@@ -804,7 +804,7 @@ function vinext(options = {}) {
 					}, instrumentationPath);
 				}
 				if (id === RESOLVED_ROOT_PARAMS) return generateRootParamsModule((hasAppDir ? await appRouter(appDir, nextConfig?.pageExtensions, fileMatcher) : []).flatMap((route) => route.rootParamNames ?? []));
-				if (id === RESOLVED_APP_SSR_ENTRY && hasAppDir) return generateSsrEntry(hasPagesDir);
+				if (id === RESOLVED_APP_SSR_ENTRY && hasAppDir) return generateSsrEntry(await appRouter(appDir, nextConfig?.pageExtensions, fileMatcher), hasPagesDir);
 				if (id === RESOLVED_APP_BROWSER_ENTRY && hasAppDir) return generateBrowserEntry(await appRouter(appDir, nextConfig?.pageExtensions, fileMatcher));
 				if (id.startsWith(\"\\\\0virtual:vinext-google-fonts?\")) return generateGoogleFontsVirtualModule(id, _fontGoogleShimPath);
 			},

Drop into patches/vinext@0.0.50.patch, add \"vinext@0.0.50\": \"patches/vinext@0.0.50.patch\" to package.json → patchedDependencies, run bun install.

---

Caveat: moving route handlers into the SSR env introduces a new bug — calling a 'use server' function directly from a route handler now throws noServerCall because plugin-rsc's SSR 'use server' transform replaces the function body with a server-reference stub. Tracked separately in #1246 with the full architectural conflict and three suggested fixes.