@react-router/dev 7.10.1-pre.0 → 7.11.0-pre.0

package/CHANGELOG.md

@@ -1,15 +1,33 @@
 # `@react-router/dev`
 
-## 7.10.1-pre.0
+## 7.11.0-pre.0
+
+### Minor Changes
+
+- feat: add `vite preview` support ([#14507](https://github.com/remix-run/react-router/pull/14507))
+
+### Patch Changes
+
+- rsc framework mode manual chunking for react and react-router deps ([#14655](https://github.com/remix-run/react-router/pull/14655))
+- add support for throwing redirect Response's at RSC render time ([#14596](https://github.com/remix-run/react-router/pull/14596))
+- support custom entrypoints for RSC framework mode ([#14643](https://github.com/remix-run/react-router/pull/14643))
+- `routeRSCServerRequest` replace `fetchServer` with `serverResponse` ([#14597](https://github.com/remix-run/react-router/pull/14597))
+- rsc framewlrk mode - optimize react-server-dom-webpack if in project package.json ([#14656](https://github.com/remix-run/react-router/pull/14656))
+- Updated dependencies:
+  - `react-router@7.11.0-pre.0`
+  - `@react-router/serve@7.11.0-pre.0`
+  - `@react-router/node@7.11.0-pre.0`
+
+## 7.10.1
 
 ### Patch Changes
 
-- Import ESM package `pkg-types` with a dynamic import to avoid issues on Node 20.18 and below ([`4a4a1273b`](https://github.com/remix-run/react-router/commit/4a4a1273be0143fd08e04a611cc88f134af3a8f4))
-- Update `valibot` dependency to `^1.2.0` ([`ef67e101a`](https://github.com/remix-run/react-router/commit/ef67e101ab7e349ab1a2526b2e6b991fb79deff1))
+- Import ESM package `pkg-types` with a dynamic `import()` to fix issues on Node 20.18 ([#14624](https://github.com/remix-run/react-router/pull/14624))
+- Update `valibot` dependency to `^1.2.0` to address [GHSA-vqpr-j7v3-hqw9](https://github.com/advisories/GHSA-vqpr-j7v3-hqw9) ([#14608](https://github.com/remix-run/react-router/pull/14608))
 - Updated dependencies:
-  - `react-router@7.10.1-pre.0`
-  - `@react-router/node@7.10.1-pre.0`
-  - `@react-router/serve@7.10.1-pre.0`
+  - `react-router@7.10.1`
+  - `@react-router/node@7.10.1`
+  - `@react-router/serve@7.10.1`
 
 ## 7.10.0
 

package/dist/cli/index.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 /**
- * @react-router/dev v7.10.1-pre.0
+ * @react-router/dev v7.11.0-pre.0
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/config/default-rsc-entries/entry.rsc.tsx

@@ -6,22 +6,36 @@ import {
   loadServerAction,
   renderToReadableStream,
 } from "@vitejs/plugin-rsc/rsc";
-import { unstable_matchRSCServerRequest as matchRSCServerRequest } from "react-router";
+import {
+  RouterContextProvider,
+  unstable_matchRSCServerRequest as matchRSCServerRequest,
+} from "react-router";
 
+// Import the routes generated by routes.ts
 import routes from "virtual:react-router/unstable_rsc/routes";
 import basename from "virtual:react-router/unstable_rsc/basename";
 import unstable_reactRouterServeConfig from "virtual:react-router/unstable_rsc/react-router-serve-config";
 
-export async function fetchServer(request: Request) {
-  return await matchRSCServerRequest({
+export { unstable_reactRouterServeConfig };
+
+export function fetchServer(
+  request: Request,
+  requestContext?: RouterContextProvider,
+) {
+  return matchRSCServerRequest({
+    basename,
+    // Provide the React Server touchpoints.
     createTemporaryReferenceSet,
     decodeAction,
     decodeFormState,
     decodeReply,
     loadServerAction,
+    // The incoming request.
     request,
+    requestContext,
+    // The app routes.
     routes,
-    basename,
+    // Encode the match with the React Server implementation.
     generateResponse(match, options) {
       return new Response(renderToReadableStream(match.payload, options), {
         status: match.statusCode,
@@ -31,14 +45,22 @@ export async function fetchServer(request: Request) {
   });
 }
 
-export { unstable_reactRouterServeConfig };
+export default {
+  async fetch(request: Request, requestContext?: RouterContextProvider) {
+    if (requestContext && !(requestContext instanceof RouterContextProvider)) {
+      requestContext = undefined;
+    }
 
-export default async function handler(request: Request) {
-  const ssr = await import.meta.viteRsc.loadModule<
-    typeof import("./entry.ssr")
-  >("ssr", "index");
-  return ssr.default(request, fetchServer);
-}
+    const ssr = await import.meta.viteRsc.loadModule<
+      typeof import("./entry.ssr.tsx")
+    >("ssr", "index");
+
+    return await ssr.generateHTML(
+      request,
+      await fetchServer(request, requestContext),
+    );
+  },
+};
 
 if (import.meta.hot) {
   import.meta.hot.accept();

package/dist/config/default-rsc-entries/entry.ssr.tsx

@@ -1,31 +1,38 @@
 import { createFromReadableStream } from "@vitejs/plugin-rsc/ssr";
-// @ts-expect-error
-import * as ReactDomServer from "react-dom/server.edge";
+// @ts-expect-error - no types for this, can import from root once on latest 19
+import { renderToReadableStream } from "react-dom/server.edge";
 import {
-  unstable_RSCStaticRouter as RSCStaticRouter,
   unstable_routeRSCServerRequest as routeRSCServerRequest,
+  unstable_RSCStaticRouter as RSCStaticRouter,
 } from "react-router";
 
-export default async function handler(
+export async function generateHTML(
   request: Request,
-  fetchServer: (request: Request) => Promise<Response>,
-) {
-  const bootstrapScriptContent =
-    await import.meta.viteRsc.loadBootstrapScriptContent("index");
-
-  return routeRSCServerRequest({
+  serverResponse: Response,
+): Promise<Response> {
+  return await routeRSCServerRequest({
+    // The incoming request.
     request,
-    fetchServer,
+    // The response from the RSC server.
+    serverResponse,
+    // Provide the React Server touchpoints.
     createFromReadableStream,
-    async renderHTML(getPayload) {
-      const payload = getPayload();
+    // Render the router to HTML.
+    async renderHTML(getPayload, options) {
+      const payload = await getPayload();
+      const formState =
+        payload.type === "render" ? await payload.formState : undefined;
+
+      const bootstrapScriptContent =
+        await import.meta.viteRsc.loadBootstrapScriptContent("index");
 
-      return ReactDomServer.renderToReadableStream(
+      return await renderToReadableStream(
         <RSCStaticRouter getPayload={getPayload} />,
         {
+          ...options,
           bootstrapScriptContent,
+          formState,
           signal: request.signal,
-          formState: await payload.formState,
         },
       );
     },

package/dist/config.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v7.10.1-pre.0
+ * @react-router/dev v7.11.0-pre.0
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/routes.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v7.10.1-pre.0
+ * @react-router/dev v7.11.0-pre.0
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/vite/cloudflare.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v7.10.1-pre.0
+ * @react-router/dev v7.11.0-pre.0
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/vite.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v7.10.1-pre.0
+ * @react-router/dev v7.11.0-pre.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -639,11 +639,11 @@ async function createConfigLoader({
         fsWatcher = import_chokidar.default.watch([root, appDirectory], {
           ignoreInitial: true,
           ignored: (path9) => {
-            let dirname5 = import_pathe3.default.dirname(path9);
-            return !dirname5.startsWith(appDirectory) && // Ensure we're only watching files outside of the app directory
+            let dirname4 = import_pathe3.default.dirname(path9);
+            return !dirname4.startsWith(appDirectory) && // Ensure we're only watching files outside of the app directory
             // that are at the root level, not nested in subdirectories
             path9 !== root && // Watch the root directory itself
-            dirname5 !== root;
+            dirname4 !== root;
           }
         });
         fsWatcher.on("all", async (...args) => {
@@ -775,6 +775,30 @@ async function resolveEntryFiles({
   let entryServerFilePath = userEntryServerFile ? import_pathe3.default.resolve(reactRouterConfig.appDirectory, userEntryServerFile) : import_pathe3.default.resolve(defaultsDirectory, entryServerFile);
   return { entryClientFilePath, entryServerFilePath };
 }
+async function resolveRSCEntryFiles({
+  reactRouterConfig
+}) {
+  let { appDirectory } = reactRouterConfig;
+  let defaultsDirectory = import_pathe3.default.resolve(
+    import_pathe3.default.dirname(require.resolve("@react-router/dev/package.json")),
+    "dist",
+    "config",
+    "default-rsc-entries"
+  );
+  let userEntryClientFile = findEntry(appDirectory, "entry.client", {
+    absolute: true
+  });
+  let userEntryRSCFile = findEntry(appDirectory, "entry.rsc", {
+    absolute: true
+  });
+  let userEntrySSRFile = findEntry(appDirectory, "entry.ssr", {
+    absolute: true
+  });
+  let client = userEntryClientFile ?? import_pathe3.default.join(defaultsDirectory, "entry.client.tsx");
+  let rsc = userEntryRSCFile ?? import_pathe3.default.join(defaultsDirectory, "entry.rsc.tsx");
+  let ssr = userEntrySSRFile ?? import_pathe3.default.join(defaultsDirectory, "entry.ssr.tsx");
+  return { client, rsc, ssr };
+}
 function omitRoutes(config) {
   return {
     ...config,
@@ -3510,6 +3534,34 @@ var reactRouterVitePlugin = () => {
           }
         };
       },
+      configurePreviewServer(previewServer) {
+        return () => {
+          previewServer.middlewares.use(async (req, res, next) => {
+            try {
+              let serverBuildDirectory = getServerBuildDirectory(
+                ctx.reactRouterConfig
+              );
+              let serverBuildFile = path6.resolve(
+                serverBuildDirectory,
+                "index.js"
+              );
+              let build = await import(url.pathToFileURL(serverBuildFile).href);
+              let handler = (0, import_react_router2.createRequestHandler)(build, "production");
+              let nodeHandler = async (nodeReq, nodeRes) => {
+                let req2 = fromNodeRequest(nodeReq, nodeRes);
+                let res2 = await handler(
+                  req2,
+                  await reactRouterDevLoadContext(req2)
+                );
+                await (0, import_node_fetch_server2.sendResponse)(nodeRes, res2);
+              };
+              await nodeHandler(req, res);
+            } catch (error) {
+              next(error);
+            }
+          });
+        };
+      },
       writeBundle: {
         // After the SSR build is finished, we inspect the Vite manifest for
         // the SSR build and move server-only assets to client assets directory
@@ -4986,7 +5038,6 @@ var import_es_module_lexer3 = require("es-module-lexer");
 var Path5 = __toESM(require("pathe"));
 var babel2 = __toESM(require("@babel/core"));
 var import_picocolors5 = __toESM(require("picocolors"));
-var import_fs = require("fs");
 var import_promises3 = require("fs/promises");
 var import_pathe6 = __toESM(require("pathe"));
 
@@ -5321,13 +5372,16 @@ function isRootRouteFile({
 
 // vite/rsc/plugin.ts
 function reactRouterRSCVitePlugin() {
+  let runningWithinTheReactRouterMonoRepo = Boolean(
+    arguments && arguments.length === 1 && typeof arguments[0] === "object" && arguments[0] && "__runningWithinTheReactRouterMonoRepo" in arguments[0] && arguments[0].__runningWithinTheReactRouterMonoRepo === true
+  );
   let configLoader;
   let typegenWatcherPromise;
   let viteCommand;
   let resolvedViteConfig;
   let routeIdByFile;
   let logger;
-  const defaultEntries2 = getDefaultEntries();
+  let entries;
   let config;
   let rootRouteFile;
   function updateConfig(newConfig) {
@@ -5390,22 +5444,34 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
         logger = vite2.createLogger(viteUserConfig.logLevel, {
           prefix: "[react-router]"
         });
+        entries = await resolveRSCEntryFiles({
+          reactRouterConfig: config
+        });
+        let viteNormalizePath = (await import("vite")).normalizePath;
         return {
           resolve: {
             dedupe: [
               // https://react.dev/warnings/invalid-hook-call-warning#duplicate-react
               "react",
+              "react/jsx-runtime",
+              "react/jsx-dev-runtime",
               "react-dom",
+              "react-dom/client",
               // Avoid router duplicates since mismatching routers cause `Error:
               // You must render this element inside a <Remix> element`.
               "react-router",
               "react-router/dom",
-              ...hasDependency({ name: "react-router-dom", rootDirectory }) ? ["react-router-dom"] : []
+              "react-router/internal/react-server-client",
+              ...hasDependency({ name: "react-router-dom", rootDirectory }) ? ["react-router-dom"] : [],
+              ...hasDependency({
+                name: "react-server-dom-webpack",
+                rootDirectory
+              }) ? ["react-server-dom-webpack"] : []
             ]
           },
           optimizeDeps: {
             entries: getOptimizeDepsEntries({
-              entryClientFilePath: defaultEntries2.client,
+              entryClientFilePath: entries.client,
               reactRouterConfig: config
             }),
             esbuildOptions: {
@@ -5419,8 +5485,17 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
               "react/jsx-runtime",
               "react/jsx-dev-runtime",
               "react-dom",
-              "react-dom/client",
-              "react-router/internal/react-server-client"
+              ...hasDependency({
+                name: "react-server-dom-webpack",
+                rootDirectory
+              }) ? ["react-server-dom-webpack"] : [],
+              ...runningWithinTheReactRouterMonoRepo ? [] : [
+                "react-router",
+                "react-router/dom",
+                "react-router/internal/react-server-client"
+              ],
+              "react-router > cookie",
+              "react-router > set-cookie-parser"
             ]
           },
           esbuild: {
@@ -5432,27 +5507,30 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
               build: {
                 rollupOptions: {
                   input: {
-                    index: defaultEntries2.client
+                    index: entries.client
+                  },
+                  output: {
+                    manualChunks(id) {
+                      const normalized = viteNormalizePath(id);
+                      if (normalized.includes("node_modules/react/") || normalized.includes("node_modules/react-dom/") || normalized.includes(
+                        "node_modules/react-server-dom-webpack/"
+                      ) || normalized.includes("node_modules/@vitejs/plugin-rsc/")) {
+                        return "react";
+                      }
+                      if (normalized.includes("node_modules/react-router/")) {
+                        return "router";
+                      }
+                    }
                   }
                 },
                 outDir: (0, import_pathe6.join)(config.buildDirectory, "client")
-              },
-              optimizeDeps: {
-                include: [
-                  "react-router > cookie",
-                  "react-router > set-cookie-parser"
-                ]
               }
             },
             rsc: {
               build: {
                 rollupOptions: {
                   input: {
-                    // We use a virtual entry here so that consumers can import
-                    // it as `virtual:react-router/unstable_rsc/rsc-entry`
-                    // without needing to know the actual file path, which is
-                    // important when using the default entries.
-                    index: defaultEntries2.rsc
+                    index: entries.rsc
                   },
                   output: {
                     entryFileNames: config.serverBuildFile,
@@ -5460,13 +5538,18 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
                   }
                 },
                 outDir: (0, import_pathe6.join)(config.buildDirectory, "server")
+              },
+              resolve: {
+                noExternal: [
+                  "@react-router/dev/config/default-rsc-entries/entry.ssr"
+                ]
               }
             },
             ssr: {
               build: {
                 rollupOptions: {
                   input: {
-                    index: defaultEntries2.ssr
+                    index: entries.ssr
                   },
                   output: {
                     // Note: We don't set `entryFileNames` here because it's
@@ -5477,6 +5560,11 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
                   }
                 },
                 outDir: (0, import_pathe6.join)(config.buildDirectory, "server/__ssr_build")
+              },
+              resolve: {
+                noExternal: [
+                  "@react-router/dev/config/default-rsc-entries/entry.rsc"
+                ]
               }
             }
           },
@@ -5580,12 +5668,6 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
         (await typegenWatcherPromise)?.close();
       }
     },
-    {
-      name: "react-router/rsc/virtual-rsc-entry",
-      resolveId(id) {
-        if (id === virtual2.rscEntry.id) return defaultEntries2.rsc;
-      }
-    },
     {
       name: "react-router/rsc/virtual-route-config",
       resolveId(id) {
@@ -5661,7 +5743,7 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
         const reactRefreshDir = import_pathe6.default.dirname(
           require.resolve("react-refresh/package.json")
         );
-        const reactRefreshRuntimePath = import_pathe6.default.join(
+        const reactRefreshRuntimePath = (0, import_pathe6.join)(
           reactRefreshDir,
           "cjs/react-refresh-runtime.development.js"
         );
@@ -5788,7 +5870,6 @@ var virtual2 = {
   injectHmrRuntime: create("unstable_rsc/inject-hmr-runtime"),
   hmrRuntime: create("unstable_rsc/runtime"),
   basename: create("unstable_rsc/basename"),
-  rscEntry: create("unstable_rsc/rsc-entry"),
   reactRouterServeConfig: create("unstable_rsc/react-router-serve-config")
 };
 function invalidateVirtualModules2(viteDevServer) {
@@ -5804,33 +5885,6 @@ function invalidateVirtualModules2(viteDevServer) {
 function getRootDirectory(viteUserConfig) {
   return viteUserConfig.root ?? process.env.REACT_ROUTER_ROOT ?? process.cwd();
 }
-function getDevPackageRoot() {
-  const currentDir = (0, import_pathe6.dirname)(__dirname);
-  let dir = currentDir;
-  while (dir !== (0, import_pathe6.dirname)(dir)) {
-    try {
-      const packageJsonPath = (0, import_pathe6.join)(dir, "package.json");
-      (0, import_fs.readFileSync)(packageJsonPath, "utf-8");
-      return dir;
-    } catch {
-      dir = (0, import_pathe6.dirname)(dir);
-    }
-  }
-  throw new Error("Could not find package.json");
-}
-function getDefaultEntries() {
-  const defaultEntriesDir2 = (0, import_pathe6.join)(
-    getDevPackageRoot(),
-    "dist",
-    "config",
-    "default-rsc-entries"
-  );
-  return {
-    rsc: (0, import_pathe6.join)(defaultEntriesDir2, "entry.rsc.tsx"),
-    ssr: (0, import_pathe6.join)(defaultEntriesDir2, "entry.ssr.tsx"),
-    client: (0, import_pathe6.join)(defaultEntriesDir2, "entry.client.tsx")
-  };
-}
 function getModulesWithImporters(modules) {
   const visited = /* @__PURE__ */ new Set();
   const result = /* @__PURE__ */ new Set();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-router/dev",
-  "version": "7.10.1-pre.0",
+  "version": "7.11.0-pre.0",
   "description": "Dev tools and CLI for React Router",
   "homepage": "https://reactrouter.com",
   "bugs": {
@@ -13,6 +13,9 @@
   },
   "license": "MIT",
   "exports": {
+    "./config/default-rsc-entries/entry.client": "./dist/config/default-rsc-entries/entry.client.tsx",
+    "./config/default-rsc-entries/entry.rsc": "./dist/config/default-rsc-entries/entry.rsc.tsx",
+    "./config/default-rsc-entries/entry.ssr": "./dist/config/default-rsc-entries/entry.ssr.tsx",
     "./config": {
       "types": "./dist/config.d.ts",
       "default": "./dist/config.js"
@@ -21,6 +24,7 @@
       "types": "./dist/routes.d.ts",
       "default": "./dist/routes.js"
     },
+    "./rsc-types": "./rsc-types.d.ts",
     "./vite": {
       "types": "./dist/vite.d.ts",
       "default": "./dist/vite.js"
@@ -44,6 +48,7 @@
     "build": {
       "command": "tsup",
       "files": [
+        "../../pnpm-workspace.yaml",
         "cli/**",
         "config/**",
         "module-sync-enabled/**",
@@ -87,7 +92,7 @@
     "tinyglobby": "^0.2.14",
     "valibot": "^1.2.0",
     "vite-node": "^3.2.2",
-    "@react-router/node": "7.10.1-pre.0"
+    "@react-router/node": "7.11.0-pre.0"
   },
   "devDependencies": {
     "@types/babel__core": "^7.20.5",
@@ -95,31 +100,33 @@
     "@types/babel__traverse": "^7.20.7",
     "@types/dedent": "^0.7.0",
     "@types/express": "^4.17.9",
+    "@types/jest": "^29.5.4",
     "@types/jsesc": "^3.0.1",
     "@types/lodash": "^4.14.182",
     "@types/node": "^20.0.0",
     "@types/npmcli__package-json": "^4.0.0",
     "@types/semver": "^7.7.0",
-    "@vitejs/plugin-rsc": "0.4.30",
+    "@vitejs/plugin-rsc": "~0.5.7",
     "esbuild-register": "^3.6.0",
     "execa": "5.1.1",
     "express": "^4.19.2",
     "fast-glob": "3.2.11",
     "tsup": "^8.3.0",
-    "typescript": "^5.1.6",
+    "typescript": "^5.4.5",
     "vite": "^6.3.0",
     "wireit": "0.14.9",
     "wrangler": "^4.23.0",
-    "@react-router/serve": "7.10.1-pre.0",
-    "react-router": "^7.10.1-pre.0"
+    "@react-router/serve": "7.11.0-pre.0",
+    "react-router": "^7.11.0-pre.0"
   },
   "peerDependencies": {
-    "@vitejs/plugin-rsc": "*",
+    "@vitejs/plugin-rsc": "~0.5.7",
+    "react-server-dom-webpack": "^19.2.3",
     "typescript": "^5.1.0",
     "vite": "^5.1.0 || ^6.0.0 || ^7.0.0",
     "wrangler": "^3.28.2 || ^4.0.0",
-    "@react-router/serve": "^7.10.1-pre.0",
-    "react-router": "^7.10.1-pre.0"
+    "@react-router/serve": "^7.11.0-pre.0",
+    "react-router": "^7.11.0-pre.0"
   },
   "peerDependenciesMeta": {
     "@vitejs/plugin-rsc": {
@@ -131,6 +138,9 @@
     "typescript": {
       "optional": true
     },
+    "react-server-dom-webpack": {
+      "optional": true
+    },
     "wrangler": {
       "optional": true
     }
@@ -142,6 +152,7 @@
     "dist/",
     "module-sync-enabled/",
     "bin.js",
+    "rsc-types.d.ts",
     "CHANGELOG.md",
     "LICENSE.md",
     "README.md"

package/rsc-types.d.ts

@@ -0,0 +1,21 @@
+declare module "virtual:react-router/unstable_rsc/routes" {
+  import type { unstable_RSCRouteConfig as RSCRouteConfig } from "react-router";
+
+  const routes: RSCRouteConfig;
+  export default routes;
+}
+
+declare module "virtual:react-router/unstable_rsc/basename" {
+  const basename: string;
+  export default basename;
+}
+
+declare module "virtual:react-router/unstable_rsc/react-router-serve-config" {
+  const unstable_reactRouterServeConfig: {
+    publicPath: string;
+    assetsBuildDirectory: string;
+  };
+  export default unstable_reactRouterServeConfig;
+}
+
+declare module "virtual:react-router/unstable_rsc/inject-hmr-runtime" {}