@ivogt/rsc-router 0.0.0-experimental.1 → 0.0.0-experimental.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ivogt/rsc-router",
-  "version": "0.0.0-experimental.1",
+  "version": "0.0.0-experimental.2",
   "type": "module",
   "description": "Type-safe RSC router with partial rendering support",
   "author": "Ivo Todorov",

package/src/server/root-layout.tsx

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import { Outlet } from "rsc-router/client";
+import { Outlet } from "../client.js";
 
 const MapRootLayout = (
   <>

package/src/vite/index.ts

@@ -21,6 +21,39 @@ export { exposeLocationStateId } from "./expose-location-state-id.ts";
 
 // Virtual module type declarations in ./version.d.ts
 
+/**
+ * Plugin to transform CJS react-server-dom vendor file to ESM.
+ * The @vitejs/plugin-rsc package ships client.browser.js as CommonJS
+ * which doesn't work in the browser. This transforms it to ESM re-exports.
+ */
+function createCjsToEsmPlugin(): Plugin {
+  return {
+    name: "rsc-router:cjs-to-esm",
+    enforce: "pre",
+    transform(code, id) {
+      // Transform the client.browser.js file from CJS to ESM
+      // Match any path containing vendor/react-server-dom/client.browser.js
+      if (
+        id.includes("vendor/react-server-dom/client.browser.js") ||
+        id.includes("vendor\\react-server-dom\\client.browser.js")
+      ) {
+        // The original file uses: module.exports = require('./cjs/...')
+        // Transform to ESM re-export from the development or production CJS file
+        const isProd = process.env.NODE_ENV === "production";
+        const cjsFile = isProd
+          ? "./cjs/react-server-dom-webpack-client.browser.production.js"
+          : "./cjs/react-server-dom-webpack-client.browser.development.js";
+
+        return {
+          code: `export * from "${cjsFile}";`,
+          map: null,
+        };
+      }
+      return null;
+    },
+  };
+}
+
 /**
  * RSC plugin entry points configuration.
  * All entries use virtual modules by default. Specify a path to use a custom entry file.
@@ -422,6 +455,27 @@ export async function rscRouter(
       config() {
         // Configure environments for cloudflare deployment
         return {
+          resolve: {
+            alias: {
+              // Map rsc-router/* to @ivogt/rsc-router/* for virtual entries
+              // This allows the package to work when published under a scoped name
+              "rsc-router/internal/deps/browser":
+                "@ivogt/rsc-router/internal/deps/browser",
+              "rsc-router/internal/deps/ssr":
+                "@ivogt/rsc-router/internal/deps/ssr",
+              "rsc-router/internal/deps/rsc":
+                "@ivogt/rsc-router/internal/deps/rsc",
+              "rsc-router/internal/deps/html-stream-client":
+                "@ivogt/rsc-router/internal/deps/html-stream-client",
+              "rsc-router/internal/deps/html-stream-server":
+                "@ivogt/rsc-router/internal/deps/html-stream-server",
+              "rsc-router/browser": "@ivogt/rsc-router/browser",
+              "rsc-router/client": "@ivogt/rsc-router/client",
+              "rsc-router/server": "@ivogt/rsc-router/server",
+              "rsc-router/rsc": "@ivogt/rsc-router/rsc",
+              "rsc-router/ssr": "@ivogt/rsc-router/ssr",
+            },
+          },
           environments: {
             client: {
               build: {
@@ -515,6 +569,27 @@ export async function rscRouter(
           const useVirtualRSC = finalEntries.rsc === VIRTUAL_IDS.rsc;
 
           return {
+            resolve: {
+              alias: {
+                // Map rsc-router/* to @ivogt/rsc-router/* for virtual entries
+                // This allows the package to work when published under a scoped name
+                "rsc-router/internal/deps/browser":
+                  "@ivogt/rsc-router/internal/deps/browser",
+                "rsc-router/internal/deps/ssr":
+                  "@ivogt/rsc-router/internal/deps/ssr",
+                "rsc-router/internal/deps/rsc":
+                  "@ivogt/rsc-router/internal/deps/rsc",
+                "rsc-router/internal/deps/html-stream-client":
+                  "@ivogt/rsc-router/internal/deps/html-stream-client",
+                "rsc-router/internal/deps/html-stream-server":
+                  "@ivogt/rsc-router/internal/deps/html-stream-server",
+                "rsc-router/browser": "@ivogt/rsc-router/browser",
+                "rsc-router/client": "@ivogt/rsc-router/client",
+                "rsc-router/server": "@ivogt/rsc-router/server",
+                "rsc-router/rsc": "@ivogt/rsc-router/rsc",
+                "rsc-router/ssr": "@ivogt/rsc-router/ssr",
+              },
+            },
             environments: {
               client: {
                 build: {
@@ -603,6 +678,10 @@ export async function rscRouter(
     plugins.push(createVersionInjectorPlugin(rscEntryPath));
   }
 
+  // Add CJS-to-ESM transform for @vitejs/plugin-rsc vendor files
+  // This must be added to transform the CommonJS client.browser.js to ESM
+  plugins.push(createCjsToEsmPlugin());
+
   return plugins;
 }