@react-router/dev 7.14.1 → 7.14.2

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # `@react-router/dev`
 
+## v7.14.2
+
+### Patch Changes
+
+- Fix typegen for layouts without pages ([[aabf4a1](https://github.com/remix-run/react-router/commit/aabf4a1))
+
+  Previously, typegen could produce `pages: ;` in `.react-router/types/+routes.ts` when a route corresponded to 0 pages.
+  Now, `pages: never;` is correctly generated for those cases.
+
+### Unstable Changes
+
+⚠️  _[Unstable features](https://reactrouter.com/community/api-development-strategy#unstable-flags) are not recommended for production use_
+
+- For `unstable_reactRouterRSC` Vite plugin consumers, require `@vitejs/plugin-react` in user Vite config, and more reliably split route modules. ([#14965](https://github.com/remix-run/react-router/pull/14965)) ([[aabf4a1](https://github.com/remix-run/react-router/commit/aabf4a1))
+
+  - ⚠️ This is a breaking change if you have begun using the `unstable_reactRouterRSC` Vite plugin - please install `@vitejs/plugin-react` and add the `react` plugin to your Vite plugins array.
+- Updated dependencies:
+  - [`react-router@7.14.2`](https://github.com/remix-run/react-router/releases/tag/react-router@7.14.2)
+  - [`@react-router/node@7.14.2`](https://github.com/remix-run/react-router/releases/tag/@react-router/node@7.14.2)
+  - [`@react-router/serve@7.14.2`](https://github.com/remix-run/react-router/releases/tag/@react-router/serve@7.14.2)
+
 ## v7.14.1
 
 ### Patch Changes

package/dist/cli/index.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 /**
- * @react-router/dev v7.14.1
+ * @react-router/dev v7.14.2
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -1078,7 +1078,7 @@ function routeFilesType({
                   t2.tsPropertySignature(
                     t2.identifier("page"),
                     t2.tsTypeAnnotation(
-                      pages ? t2.tsUnionType(
+                      pages.size > 0 ? t2.tsUnionType(
                         Array.from(pages).map(
                           (page) => t2.tsLiteralType(t2.stringLiteral(page))
                         )

package/dist/config.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v7.14.1
+ * @react-router/dev v7.14.2
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/routes.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v7.14.1
+ * @react-router/dev v7.14.2
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/vite/cloudflare.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v7.14.1
+ * @react-router/dev v7.14.2
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/vite.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v7.14.1
+ * @react-router/dev v7.14.2
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -1096,7 +1096,7 @@ function routeFilesType({
                   t2.tsPropertySignature(
                     t2.identifier("page"),
                     t2.tsTypeAnnotation(
-                      pages ? t2.tsUnionType(
+                      pages.size > 0 ? t2.tsUnionType(
                         Array.from(pages).map(
                           (page) => t2.tsLiteralType(t2.stringLiteral(page))
                         )
@@ -5677,7 +5677,6 @@ function escapeHtml(html) {
 // vite/rsc/plugin.ts
 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_promises4 = require("fs/promises");
@@ -5685,12 +5684,91 @@ var import_pathe6 = __toESM(require("pathe"));
 
 // vite/rsc/virtual-route-config.ts
 var import_pathe5 = __toESM(require("pathe"));
+var js = String.raw;
 function createVirtualRouteConfig({
   appDirectory,
   routeConfig
 }) {
   let routeIdByFile = /* @__PURE__ */ new Map();
-  let code = "export default [";
+  let code = js`import * as React from "react";
+function frameworkRoute(lazy) {
+  return async () => {
+    const mod = await lazy();
+    let Component;
+    let Layout;
+    let ErrorBoundary;
+    let HydrateFallback;
+    if ("default" in mod && mod.default) {
+      if ("ServerComponent" in mod && mod.ServerComponent) {
+        throw new Error("Module cannot have both a default export and a ServerComponent export");
+      }
+      Component = mod.default;
+    } else if ("ServerComponent" in mod && mod.ServerComponent) {
+      Component = mod.ServerComponent;
+    }
+    if ("Layout" in mod && mod.Layout) {
+      if ("ServerLayout" in mod && mod.ServerLayout) {
+        throw new Error("Module cannot have both a Layout export and a ServerLayout export");
+      }
+      Layout = mod.Layout;
+    } else if ("ServerLayout" in mod && mod.ServerLayout) {
+      Layout = mod.ServerLayout;
+    }
+    if ("ErrorBoundary" in mod && mod.ErrorBoundary) {
+      if ("ServerErrorBoundary" in mod && mod.ServerErrorBoundary) {
+        throw new Error(
+          "Module cannot have both an ErrorBoundary export and a ServerErrorBoundary export",
+        );
+      }
+      ErrorBoundary = mod.ErrorBoundary;
+    } else if ("ServerErrorBoundary" in mod && mod.ServerErrorBoundary) {
+      ErrorBoundary = mod.ServerErrorBoundary;
+    }
+    if ("HydrateFallback" in mod && mod.HydrateFallback) {
+      if ("ServerHydrateFallback" in mod && mod.ServerHydrateFallback) {
+        throw new Error(
+          "Module cannot have both a HydrateFallback export and a ServerHydrateFallback export",
+        );
+      }
+      HydrateFallback = mod.HydrateFallback;
+    } else if ("ServerHydrateFallback" in mod && mod.ServerHydrateFallback) {
+      HydrateFallback = mod.ServerHydrateFallback;
+    }
+
+    const {
+      action,
+      clientAction,
+      clientLoader,
+      clientMiddleware,
+      handle,
+      headers,
+      links,
+      loader,
+      meta,
+      middleware,
+      shouldRevalidate,
+    } = mod;
+
+    return {
+      Component,
+      ErrorBoundary,
+      HydrateFallback,
+      Layout,
+      action,
+      clientAction,
+      clientLoader,
+      clientMiddleware,
+      handle,
+      headers,
+      links,
+      loader,
+      meta,
+      middleware,
+      shouldRevalidate,
+    };
+  };
+}
+export default [`;
   const closeRouteSymbol = Symbol("CLOSE_ROUTE");
   let stack = [
     ...routeConfig
@@ -5706,9 +5784,9 @@ function createVirtualRouteConfig({
     const routeFile = import_pathe5.default.resolve(appDirectory, route.file);
     const routeId = route.id || createRouteId2(route.file, appDirectory);
     routeIdByFile.set(routeFile, routeId);
-    code += `lazy: () => import(${JSON.stringify(
-      `${routeFile}?route-module`
-    )}),`;
+    code += `lazy: frameworkRoute(() => import(${JSON.stringify(
+      `${routeFile}`
+    )})),`;
     code += `id: ${JSON.stringify(routeId)},`;
     if (typeof route.path === "string") {
       code += `path: ${JSON.stringify(route.path)},`;
@@ -5736,227 +5814,282 @@ function createRouteId2(file, appDirectory) {
 
 // vite/rsc/virtual-route-modules.ts
 var import_es_module_lexer2 = require("es-module-lexer");
-var SERVER_COMPONENT_EXPORTS = [
-  "ServerComponent",
-  "ServerLayout",
-  "ServerHydrateFallback",
-  "ServerErrorBoundary"
-];
-var SERVER_COMPONENT_EXPORTS_SET = new Set(SERVER_COMPONENT_EXPORTS);
-function isServerComponentExport(name) {
-  return SERVER_COMPONENT_EXPORTS_SET.has(name);
-}
-var SERVER_ROUTE_EXPORTS = [
-  ...SERVER_COMPONENT_EXPORTS,
-  "loader",
-  "action",
-  "middleware",
-  "headers"
-];
-var SERVER_ROUTE_EXPORTS_SET = new Set(SERVER_ROUTE_EXPORTS);
-function isServerRouteExport(name) {
-  return SERVER_ROUTE_EXPORTS_SET.has(name);
-}
-var CLIENT_NON_COMPONENT_EXPORTS2 = [
-  "clientAction",
-  "clientLoader",
-  "clientMiddleware",
-  "handle",
-  "meta",
-  "links",
-  "shouldRevalidate"
-];
-var CLIENT_ROUTE_EXPORTS2 = [
-  ...CLIENT_NON_COMPONENT_EXPORTS2,
-  "default",
-  "ErrorBoundary",
-  "HydrateFallback",
-  "Layout"
-];
-var CLIENT_ROUTE_EXPORTS_SET = new Set(CLIENT_ROUTE_EXPORTS2);
-function isClientRouteExport(name) {
-  return CLIENT_ROUTE_EXPORTS_SET.has(name);
-}
-var mutuallyExclusiveRouteExports = /* @__PURE__ */ new Map([
-  ["ErrorBoundary", "ServerErrorBoundary"],
-  ["HydrateFallback", "ServerHydrateFallback"],
-  ["Layout", "ServerLayout"],
-  ["default", "ServerComponent"]
-]);
-var ROUTE_EXPORTS = [
-  ...SERVER_ROUTE_EXPORTS,
-  ...CLIENT_ROUTE_EXPORTS2
-];
-var ROUTE_EXPORTS_SET = new Set(ROUTE_EXPORTS);
-function isRouteExport(name) {
-  return ROUTE_EXPORTS_SET.has(name);
-}
-function isCustomRouteExport(name) {
-  return !isRouteExport(name);
-}
-function hasReactServerCondition(viteEnvironment) {
-  return viteEnvironment.config.resolve.conditions.includes("react-server");
-}
-function transformVirtualRouteModules({
-  id,
-  code,
-  viteCommand,
-  routeIdByFile,
-  rootRouteFile,
-  viteEnvironment
-}) {
-  if (isVirtualRouteModuleId(id) || routeIdByFile.has(id)) {
-    return createVirtualRouteModuleCode({
-      id,
-      code,
-      rootRouteFile,
-      viteCommand,
-      viteEnvironment
-    });
-  }
-  if (isVirtualServerRouteModuleId(id)) {
-    return createVirtualServerRouteModuleCode({
-      id,
-      code,
-      viteEnvironment
-    });
-  }
-  if (isVirtualClientRouteModuleId(id)) {
-    return createVirtualClientRouteModuleCode({
-      id,
-      code,
-      rootRouteFile,
-      viteCommand
-    });
-  }
-}
-async function createVirtualRouteModuleCode({
-  id,
-  code: routeSource,
-  rootRouteFile,
-  viteCommand,
-  viteEnvironment
+var ENSURE_CLIENT_ROUTE_MODULE_CHUNK_FOR_HMR = `
+import * as ___EnsureClientRouteModuleForHMR_REACT___ from "react";
+export function EnsureClientRouteModuleForHMR___() { return ___EnsureClientRouteModuleForHMR_REACT___.createElement(___EnsureClientRouteModuleForHMR_REACT___.Fragment, null) }
+`;
+function virtualRouteModulesPlugin({
+  enforceSplitRouteModules,
+  environments: { client = ["client", "ssr"], server = ["rsc"] } = {},
+  getRouteIdForFile,
+  isRootRouteModule,
+  transformToJs,
+  shouldTransform
 }) {
-  const isReactServer = hasReactServerCondition(viteEnvironment);
-  const { staticExports, hasClientExports } = parseRouteExports(routeSource);
-  for (const exportName of staticExports) {
-    if (mutuallyExclusiveRouteExports.has(exportName)) {
-      const conflictingExport = mutuallyExclusiveRouteExports.get(exportName);
-      if (staticExports.includes(conflictingExport)) {
-        throw new Error(
-          `Route module cannot export both "${exportName}" and "${conflictingExport}". Please choose one or the other.`
-        );
+  let clientEnvironments = new Set(client);
+  let serverEnvironments = new Set(server);
+  let cache = /* @__PURE__ */ new Map();
+  async function createClientRouteEntry(id, code, isRootRouteModule2, routeId) {
+    let result = "";
+    let routeChunks = detectRouteChunks2(cache, id, code, isRootRouteModule2);
+    let { staticExports } = await parseRouteExports(code);
+    validateRouteModuleExports(staticExports);
+    let needsReactImport = false;
+    for (let exportName of staticExports) {
+      if (isServerRouteExport(exportName)) {
+        continue;
       }
-    }
-  }
-  const clientModuleId = getVirtualClientModuleId(id);
-  const serverModuleId = getVirtualServerModuleId(id);
-  let code = "";
-  if (isReactServer && staticExports.some(isServerComponentExport)) {
-    code += `import React from "react";
+      if ((exportName === "clientAction" || exportName === "clientLoader") && routeChunks.hasRouteChunkByExportName[exportName]) {
+        result += `export const ${exportName} = async (...args) => import("${createId(id, "client-route-module", exportName)}").then(mod => mod.${exportName}(...args));
+`;
+      } else if (exportName === "HydrateFallback") {
+        needsReactImport = true;
+        result += `export const ${exportName} = React.lazy(() => import("${createId(
+          id,
+          "client-route-module",
+          routeChunks.hasRouteChunkByExportName[exportName] ? exportName : "shared"
+        )}").then(mod => ({ default: mod.${exportName} })));
+`;
+      } else {
+        result += `export { ${exportName} } from "${createId(
+          id,
+          "client-route-module",
+          routeChunks.hasRouteChunkByExportName[exportName] ? exportName : "shared"
+        )}";
 `;
+      }
+    }
+    if (needsReactImport) {
+      result = `import * as React from "react";
+${result}`;
+    }
+    if (enforceSplitRouteModules() && !isRootRouteModule2) {
+      let { hasRouteChunkByExportName } = routeChunks;
+      let hasClientAction = staticExports.includes("clientAction");
+      let hasClientLoader = staticExports.includes("clientLoader");
+      let hasClientMiddleware = staticExports.includes("clientMiddleware");
+      let hasHydrateFallback = staticExports.includes("HydrateFallback");
+      validateRouteChunks2({
+        id: routeId,
+        valid: {
+          clientAction: !hasClientAction || hasRouteChunkByExportName.clientAction,
+          clientLoader: !hasClientLoader || hasRouteChunkByExportName.clientLoader,
+          clientMiddleware: !hasClientMiddleware || hasRouteChunkByExportName.clientMiddleware,
+          HydrateFallback: !hasHydrateFallback || hasRouteChunkByExportName.HydrateFallback
+        }
+      });
+    }
+    return {
+      code: '"use client";\n' + result
+    };
   }
-  for (const staticExport of staticExports) {
-    if (isReactServer && isServerComponentExport(staticExport)) {
-      code += `import { ${staticExport} as ${staticExport}WithoutCss } from "${serverModuleId}";
+  async function createServerRouteEntry(id, code, isRootRouteModule2, routeId) {
+    let result = "";
+    let routeChunks = detectRouteChunks2(cache, id, code, isRootRouteModule2);
+    let { staticExports } = await parseRouteExports(code);
+    validateRouteModuleExports(staticExports);
+    let needsReactImport = false;
+    for (let exportName of staticExports) {
+      if (isClientRouteExport(exportName)) {
+        result += `export { ${exportName} } from "${createId(
+          id,
+          "client-route-module",
+          routeChunks.hasRouteChunkByExportName[exportName] ? exportName : "shared"
+        )}";
 `;
-      code += `export ${staticExport === "ServerComponent" ? "default " : " "}function ${staticExport.replace(/^Server/, "")}(props) {
+      } else if (isServerComponentExport(exportName)) {
+        needsReactImport = true;
+        result += `import { ${exportName} as ${exportName}WithoutCss } from "${createId(id, "server-route-module")}";
 `;
-      code += `  return React.createElement(React.Fragment, null,
+        result += `export function ${exportName}(props) {
 `;
-      code += `    import.meta.viteRsc.loadCss(),
+        result += `  return React.createElement(React.Fragment, null,
 `;
-      code += `    React.createElement(${staticExport}WithoutCss, props),
+        result += `    import.meta.viteRsc.loadCss(),
 `;
-      code += `  );
+        result += `    React.createElement(EnsureClientRouteModuleForHMR___, null),
 `;
-      code += `}
+        result += `    React.createElement(${exportName}WithoutCss, props),
 `;
-    } else if (isReactServer && isServerRouteExport(staticExport)) {
-      code += `export { ${staticExport} } from "${serverModuleId}";
+        result += `  );
 `;
-    } else if (isClientRouteExport(staticExport)) {
-      code += `export { ${staticExport} } from "${clientModuleId}";
+        result += `}
 `;
-    } else if (isCustomRouteExport(staticExport)) {
-      code += `export { ${staticExport} } from "${isReactServer ? serverModuleId : clientModuleId}";
+      } else {
+        result += `export { ${exportName} } from "${createId(id, "server-route-module")}";
 `;
+      }
     }
-  }
-  if (isRootRouteFile({ id, rootRouteFile }) && !staticExports.includes("ErrorBoundary") && !staticExports.includes("ServerErrorBoundary")) {
-    code += `export { ErrorBoundary } from "${clientModuleId}";
-`;
-  }
-  if (viteCommand === "serve" && !hasClientExports) {
-    code += `export { __ensureClientRouteModuleForHMR } from "${clientModuleId}";
+    if (needsReactImport) {
+      result = `import * as React from "react";
+import { EnsureClientRouteModuleForHMR___ } from "${createId(id, "client-route-module", "shared")}";
+
+${result}`;
+    }
+    if (isRootRouteModule2 && !staticExports.includes("ErrorBoundary") && !staticExports.includes("ServerErrorBoundary")) {
+      result += `export { ErrorBoundary } from "${createId(id, "client-route-module", "shared")}";
 `;
+    }
+    if (enforceSplitRouteModules() && !isRootRouteModule2) {
+      let { hasRouteChunkByExportName } = routeChunks;
+      let hasClientAction = staticExports.includes("clientAction");
+      let hasClientLoader = staticExports.includes("clientLoader");
+      let hasClientMiddleware = staticExports.includes("clientMiddleware");
+      let hasHydrateFallback = staticExports.includes("HydrateFallback");
+      validateRouteChunks2({
+        id: routeId,
+        valid: {
+          clientAction: !hasClientAction || hasRouteChunkByExportName.clientAction,
+          clientLoader: !hasClientLoader || hasRouteChunkByExportName.clientLoader,
+          clientMiddleware: !hasClientMiddleware || hasRouteChunkByExportName.clientMiddleware,
+          HydrateFallback: !hasHydrateFallback || hasRouteChunkByExportName.HydrateFallback
+        }
+      });
+    }
+    return {
+      code: result
+    };
   }
-  return code;
-}
-function createVirtualServerRouteModuleCode({
-  id,
-  code: routeSource,
-  viteEnvironment
-}) {
-  if (!hasReactServerCondition(viteEnvironment)) {
-    throw new Error(
-      [
-        "Virtual server route module was loaded outside of the RSC environment.",
-        `Environment Name: ${viteEnvironment.name}`,
-        `Module ID: ${id}`
-      ].join("\n")
-    );
+  function createServerRouteModule(code) {
+    const ast = import_parser.parse(code, {
+      sourceType: "module"
+    });
+    removeExports(ast, CLIENT_ROUTE_EXPORTS2);
+    return generate(ast);
   }
-  const { staticExports } = parseRouteExports(routeSource);
-  const clientModuleId = getVirtualClientModuleId(id);
-  const serverRouteModuleAst = import_parser.parse(routeSource, {
-    sourceType: "module"
-  });
-  removeExports(serverRouteModuleAst, CLIENT_ROUTE_EXPORTS2);
-  const generatorResult = generate(serverRouteModuleAst);
-  for (const staticExport of staticExports) {
-    if (isClientRouteExport(staticExport)) {
-      generatorResult.code += "\n";
-      generatorResult.code += `export { ${staticExport} } from "${clientModuleId}";
-`;
+  async function createClientRouteModuleChunk(id, code, chunk, routeId, isRootRouteModule2, isDevMode) {
+    let routeChunks = detectRouteChunks2(cache, id, code, isRootRouteModule2);
+    const ast = import_parser.parse(code, {
+      sourceType: "module"
+    });
+    const { staticExports } = await parseRouteExports(code);
+    if (chunk === "shared") {
+      removeExports(ast, [
+        ...SERVER_ROUTE_EXPORTS,
+        ...routeChunks.chunkedExports
+      ]);
+    } else {
+      const toRemove = /* @__PURE__ */ new Set([...SERVER_ROUTE_EXPORTS, ...staticExports]);
+      toRemove.delete(chunk);
+      removeExports(ast, Array.from(toRemove));
     }
-  }
-  return generatorResult;
-}
-function createVirtualClientRouteModuleCode({
-  id,
-  code: routeSource,
-  rootRouteFile,
-  viteCommand
-}) {
-  const { staticExports, hasClientExports } = parseRouteExports(routeSource);
-  const clientRouteModuleAst = import_parser.parse(routeSource, {
-    sourceType: "module"
-  });
-  removeExports(clientRouteModuleAst, SERVER_ROUTE_EXPORTS);
-  const generatorResult = generate(clientRouteModuleAst);
-  generatorResult.code = '"use client";' + generatorResult.code;
-  if (isRootRouteFile({ id, rootRouteFile }) && !staticExports.includes("ErrorBoundary") && !staticExports.includes("ServerErrorBoundary")) {
-    const hasRootLayout = staticExports.includes("Layout");
-    generatorResult.code += `
+    const generated = generate(ast);
+    let result = '"use client";\n' + generated.code;
+    if (chunk === "shared") {
+      if (isRootRouteModule2 && !staticExports.includes("ErrorBoundary") && !staticExports.includes("ServerErrorBoundary")) {
+        const hasRootLayout = staticExports.includes("Layout") || staticExports.includes("ServerLayout");
+        result += `
 import { createElement as __rr_createElement } from "react";
 `;
-    generatorResult.code += `import { UNSAFE_RSCDefaultRootErrorBoundary } from "react-router";
+        result += `import { UNSAFE_RSCDefaultRootErrorBoundary } from "react-router";
 `;
-    generatorResult.code += `export function ErrorBoundary() {
+        result += `export function ErrorBoundary() {
 `;
-    generatorResult.code += `  return __rr_createElement(UNSAFE_RSCDefaultRootErrorBoundary, { hasRootLayout: ${hasRootLayout} });
+        result += `  return __rr_createElement(UNSAFE_RSCDefaultRootErrorBoundary, { hasRootLayout: ${hasRootLayout} });
 `;
-    generatorResult.code += `}
+        result += `}
 `;
+      }
+      result += ENSURE_CLIENT_ROUTE_MODULE_CHUNK_FOR_HMR;
+    }
+    let hasAction = staticExports.includes("action");
+    let hasLoader = staticExports.includes("loader");
+    let hasComponent = staticExports.includes("default") || staticExports.includes("ServerComponent");
+    let hasErrorBoundary = staticExports.includes("ErrorBoundary") || staticExports.includes("ServerErrorBoundary");
+    if (isDevMode) {
+      result += `export function ReactRouterHMRMeta___() {return null;};
+`;
+      result += `Object.assign(ReactRouterHMRMeta___, {
+        hasAction: ${JSON.stringify(hasAction)},
+        hasComponent: ${JSON.stringify(hasComponent)},
+        hasErrorBoundary: ${JSON.stringify(hasErrorBoundary)},
+        hasLoader: ${JSON.stringify(hasLoader)},
+        hasClientLoader: ${JSON.stringify(staticExports.includes("clientLoader"))},
+      });
+`;
+      result += `
+if (import.meta.hot) {
+`;
+      result += `  import.meta.hot.accept((mod) => {
+          if (typeof __reactRouterDataRouter === "object") {
+            __reactRouterDataRouter._updateRoutesForHMR(new Map([[${JSON.stringify(routeId)}, {
+              routeModule: mod,
+              ...mod.ReactRouterHMRMeta___,
+            }]]));
+
+            if (${chunk === "shared" ? "!mod.default || " : ""}mod.clientLoader || (
+              mod.ReactRouterHMRMeta___.hasClientLoader || ReactRouterHMRMeta___.hasClientLoader || ReactRouterHMRMeta___.hasLoader
+            )) {
+              __reactRouterDataRouter.revalidate();
+            }
+          }
+        });
+      `;
+      result += `}
+`;
+    }
+    return {
+      code: result
+    };
   }
-  if (viteCommand === "serve" && !hasClientExports) {
-    generatorResult.code += `
-export const __ensureClientRouteModuleForHMR = true;`;
-  }
-  return generatorResult;
+  return {
+    name: "react-router-rsc-virtual-route-modules",
+    enforce: "pre",
+    async transform(_code, id) {
+      const [filename2, ...rest] = id.split("?");
+      const routeId = getRouteIdForFile(filename2);
+      if (!routeId || shouldTransform && !shouldTransform?.(filename2)) {
+        return;
+      }
+      let isClientEnvironment = clientEnvironments.has(this.environment.name);
+      let isServerEnvironment = serverEnvironments.has(this.environment.name);
+      if (!isClientEnvironment && !isServerEnvironment) {
+        return;
+      }
+      let code = await transformToJs(_code, filename2);
+      let searchParams = rest.length > 0 ? new URLSearchParams(rest.join("?")) : null;
+      let clientRouteModuleType = searchParams?.get("client-route-module");
+      let isServerRouteModule = searchParams?.has("server-route-module");
+      if (clientRouteModuleType) {
+        return await createClientRouteModuleChunk(
+          id,
+          code,
+          clientRouteModuleType,
+          routeId,
+          isRootRouteModule(filename2),
+          this.environment.mode === "dev"
+        );
+      }
+      if (isServerRouteModule) {
+        return createServerRouteModule(code);
+      }
+      if (isClientEnvironment) {
+        return await createClientRouteEntry(
+          id,
+          code,
+          isRootRouteModule(filename2),
+          routeId
+        );
+      }
+      return await createServerRouteEntry(
+        id,
+        code,
+        isRootRouteModule(filename2),
+        routeId
+      );
+    }
+  };
+}
+function createId(id, type, value) {
+  let [base, ...rest] = id.split("?");
+  const searchParams = new URLSearchParams(rest.join("?"));
+  searchParams.delete("client-route-module");
+  searchParams.delete("server-route-module");
+  searchParams.set(type, value || "");
+  return `${base}?${searchParams.toString()}`;
 }
-function parseRouteExports(code) {
+async function parseRouteExports(code) {
+  await import_es_module_lexer2.init;
   const [, exportSpecifiers] = (0, import_es_module_lexer2.parse)(code);
   const staticExports = exportSpecifiers.map(({ n: name }) => name);
   return {
@@ -5964,27 +6097,115 @@ function parseRouteExports(code) {
     hasClientExports: staticExports.some(isClientRouteExport)
   };
 }
-function getVirtualClientModuleId(id) {
-  return `${id.split("?")[0]}?client-route-module`;
+var CLIENT_NON_COMPONENT_EXPORTS2 = [
+  "clientAction",
+  "clientLoader",
+  "clientMiddleware",
+  "handle",
+  "meta",
+  "links",
+  "shouldRevalidate"
+];
+var CLIENT_ROUTE_EXPORTS2 = [
+  ...CLIENT_NON_COMPONENT_EXPORTS2,
+  "default",
+  "ErrorBoundary",
+  "HydrateFallback",
+  "Layout"
+];
+var CLIENT_ROUTE_EXPORTS_SET = new Set(CLIENT_ROUTE_EXPORTS2);
+function isClientRouteExport(name) {
+  return CLIENT_ROUTE_EXPORTS_SET.has(name);
 }
-function getVirtualServerModuleId(id) {
-  return `${id.split("?")[0]}?server-route-module`;
+var SERVER_COMPONENT_EXPORTS = [
+  "ServerComponent",
+  "ServerLayout",
+  "ServerHydrateFallback",
+  "ServerErrorBoundary"
+];
+var SERVER_COMPONENT_EXPORTS_SET = new Set(SERVER_COMPONENT_EXPORTS);
+function isServerComponentExport(name) {
+  return SERVER_COMPONENT_EXPORTS_SET.has(name);
 }
-function isVirtualRouteModuleId(id) {
-  return /(\?|&)route-module(&|$)/.test(id);
+var SERVER_ROUTE_EXPORTS = [
+  ...SERVER_COMPONENT_EXPORTS,
+  "loader",
+  "action",
+  "middleware",
+  "headers"
+];
+var SERVER_ROUTE_EXPORTS_SET = new Set(SERVER_ROUTE_EXPORTS);
+function isServerRouteExport(name) {
+  return SERVER_ROUTE_EXPORTS_SET.has(name);
 }
-function isVirtualClientRouteModuleId(id) {
-  return /(\?|&)client-route-module(&|$)/.test(id);
+var CLIENT_MODULE_CHUNKS = /* @__PURE__ */ new Set([
+  "clientAction",
+  "clientLoader",
+  "clientMiddleware",
+  "HydrateFallback"
+]);
+var MUTUALLY_EXCLUSIVE_ROUTE_EXPORTS = /* @__PURE__ */ new Map([
+  ["ErrorBoundary", "ServerErrorBoundary"],
+  ["HydrateFallback", "ServerHydrateFallback"],
+  ["Layout", "ServerLayout"],
+  ["default", "ServerComponent"]
+]);
+function validateRouteModuleExports(toValidate) {
+  let errors = [];
+  for (let [clientExport, serverExport] of MUTUALLY_EXCLUSIVE_ROUTE_EXPORTS) {
+    if (toValidate.includes(clientExport) && toValidate.includes(serverExport)) {
+      errors.push([clientExport, serverExport]);
+    }
+  }
+  if (errors.length > 0) {
+    throw new Error(
+      `Invalid route module exports. The following pairs of exports are mutually exclusive and cannot be exported from the same module:
+` + errors.map(
+        ([clientExport, serverExport]) => `- ${clientExport} and ${serverExport}`
+      ).join("\n")
+    );
+  }
 }
-function isVirtualServerRouteModuleId(id) {
-  return /(\?|&)server-route-module(&|$)/.test(id);
+function detectRouteChunks2(cache, id, code, isRootRouteModule) {
+  function noRouteChunks() {
+    return {
+      chunkedExports: [],
+      hasRouteChunks: false,
+      hasRouteChunkByExportName: {
+        clientAction: false,
+        clientLoader: false,
+        clientMiddleware: false,
+        HydrateFallback: false
+      }
+    };
+  }
+  if (isRootRouteModule) {
+    return noRouteChunks();
+  }
+  if (!Array.from(CLIENT_MODULE_CHUNKS).some(
+    (exportName) => code.includes(exportName)
+  )) {
+    return noRouteChunks();
+  }
+  let [filename2] = id.split("?");
+  return detectRouteChunks(code, cache, filename2);
 }
-function isRootRouteFile({
+function validateRouteChunks2({
   id,
-  rootRouteFile
+  valid
 }) {
-  const filePath = id.split("?")[0];
-  return filePath === rootRouteFile;
+  let invalidChunks = Object.entries(valid).filter(([_, isValid]) => !isValid).map(([chunkName]) => chunkName);
+  if (invalidChunks.length === 0) {
+    return;
+  }
+  let plural = invalidChunks.length > 1;
+  throw new Error(
+    [
+      `Error splitting route module: ${id}`,
+      invalidChunks.map((name) => `- ${name}`).join("\n"),
+      `${plural ? "These exports" : "This export"} could not be split into ${plural ? "their own chunks" : "its own chunk"} because ${plural ? "they share" : "it shares"} code with other exports. You should extract any shared code into its own module and then import it within the route module.`
+    ].join("\n\n")
+  );
 }
 
 // vite/rsc/plugin.ts
@@ -6010,6 +6231,62 @@ function reactRouterRSCVitePlugin() {
       newConfig.routes.root.file
     );
   }
+  function isRootRouteModule(id) {
+    return import_pathe6.default.normalize(id) === import_pathe6.default.normalize(rootRouteFile);
+  }
+  function getRouteIdForFile(file) {
+    let normalizedFile = import_pathe6.default.normalize(file);
+    let directMatch = routeIdByFile?.get(normalizedFile);
+    if (directMatch) {
+      return directMatch;
+    }
+    return Array.from(routeIdByFile ?? []).find(
+      ([routeFile]) => import_pathe6.default.normalize(routeFile).endsWith(normalizedFile)
+    )?.[1];
+  }
+  function isMdxRouteModule(filename2) {
+    let extension = import_pathe6.default.extname(filename2).toLowerCase();
+    return extension === ".md" || extension === ".mdx";
+  }
+  function getTransformLanguage(filename2) {
+    let extension = import_pathe6.default.extname(filename2).toLowerCase();
+    switch (extension) {
+      case ".ts":
+      case ".cts":
+      case ".mts":
+        return "ts";
+      case ".tsx":
+        return "tsx";
+      case ".js":
+      case ".cjs":
+      case ".mjs":
+      case ".jsx":
+      case ".md":
+      case ".mdx":
+        return "jsx";
+      default:
+        return void 0;
+    }
+  }
+  async function transformToJs(code, filename2) {
+    await preloadVite();
+    let vite2 = getVite();
+    let lang = getTransformLanguage(filename2);
+    return ("transformWithOxc" in vite2 && typeof vite2.transformWithOxc === "function" ? await vite2.transformWithOxc(code, filename2, {
+      lang,
+      jsx: {
+        runtime: "automatic",
+        development: viteCommand !== "build",
+        target: "esnext"
+      }
+    }) : await vite2.transformWithEsbuild(code, filename2, {
+      loader: lang,
+      target: "esnext",
+      format: "esm",
+      jsx: "automatic",
+      jsxDev: viteCommand !== "build"
+    })).code;
+  }
   return [
     {
       name: "react-router/rsc",
@@ -6035,8 +6312,6 @@ function reactRouterRSCVitePlugin() {
             if (userConfig.serverBundles) errors.push("serverBundles");
             if (userConfig.future?.v8_middleware === false)
               errors.push("future.v8_middleware: false");
-            if (userConfig.future?.v8_splitRouteModules)
-              errors.push("future.v8_splitRouteModules");
             if (userConfig.future?.v8_viteEnvironmentApi === false)
               errors.push("future.v8_viteEnvironmentApi: false");
             if (userConfig.future?.unstable_subResourceIntegrity)
@@ -6199,27 +6474,6 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
                 ]
               }
             }
-          },
-          build: {
-            rollupOptions: {
-              // Copied from https://github.com/vitejs/vite-plugin-react/blob/c602225271d4acf462ba00f8d6d8a2e42492c5cd/packages/common/warning.ts
-              onwarn(warning, defaultHandler) {
-                if (warning.code === "MODULE_LEVEL_DIRECTIVE" && (warning.message.includes("use client") || warning.message.includes("use server"))) {
-                  return;
-                }
-                if (warning.code === "SOURCEMAP_ERROR" && warning.message.includes("resolve original location") && warning.pos === 0) {
-                  return;
-                }
-                if (viteUserConfig.build?.rollupOptions?.onwarn) {
-                  viteUserConfig.build.rollupOptions.onwarn(
-                    warning,
-                    defaultHandler
-                  );
-                } else {
-                  defaultHandler(warning);
-                }
-              }
-            }
           }
         };
       },
@@ -6362,20 +6616,16 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
         }
       }
     },
-    {
-      name: "react-router/rsc/virtual-route-modules",
-      transform(code, id) {
-        if (!routeIdByFile) return;
-        return transformVirtualRouteModules({
-          code,
-          id,
-          viteCommand,
-          routeIdByFile,
-          rootRouteFile,
-          viteEnvironment: this.environment
-        });
-      }
-    },
+    virtualRouteModulesPlugin({
+      environments: {
+        client: ["client", "ssr"],
+        server: ["rsc"]
+      },
+      getRouteIdForFile,
+      isRootRouteModule,
+      transformToJs,
+      enforceSplitRouteModules: () => config.future.v8_splitRouteModules === "enforce"
+    }),
     {
       name: "react-router/rsc/virtual-basename",
       resolveId(id) {
@@ -6417,121 +6667,21 @@ ${errors.map((x) => ` - ${x}`).join("\n")}
       async load(id) {
         if (id !== virtual2.injectHmrRuntime.resolvedId) return;
         return viteCommand === "serve" ? [
-          `import RefreshRuntime from "${virtual2.hmrRuntime.id}"`,
-          "RefreshRuntime.injectIntoGlobalHook(window)",
-          "window.$RefreshReg$ = () => {}",
-          "window.$RefreshSig$ = () => (type) => type",
-          "window.__vite_plugin_react_preamble_installed__ = true"
+          `if (import.meta.hot) {
+  import.meta.hot.accept();
+  import.meta.hot.on('rsc:update', () => {
+    // Defer revalidation to the next animation frame so React Fast Refresh
+    // can apply pending client component updates first. Without this delay,
+    // the RSC payload (showing updated text) can arrive and be reconciled
+    // against a DOM that still has the old text, causing a hydration mismatch.
+    requestAnimationFrame(() => {
+      __reactRouterDataRouter.revalidate()
+    });
+  })
+}`
         ].join("\n") : "";
       }
     },
-    {
-      name: "react-router/rsc/hmr/runtime",
-      enforce: "pre",
-      resolveId(id) {
-        if (id === virtual2.hmrRuntime.id) return virtual2.hmrRuntime.resolvedId;
-      },
-      async load(id) {
-        if (id !== virtual2.hmrRuntime.resolvedId) return;
-        const reactRefreshDir = import_pathe6.default.dirname(
-          require.resolve("react-refresh/package.json")
-        );
-        const reactRefreshRuntimePath = (0, import_pathe6.join)(
-          reactRefreshDir,
-          "cjs/react-refresh-runtime.development.js"
-        );
-        return [
-          "const exports = {}",
-          await (0, import_promises4.readFile)(reactRefreshRuntimePath, "utf8"),
-          await (0, import_promises4.readFile)(
-            require.resolve("./static/rsc-refresh-utils.mjs"),
-            "utf8"
-          ),
-          "export default exports"
-        ].join("\n");
-      }
-    },
-    {
-      name: "react-router/rsc/hmr/react-refresh",
-      async transform(code, id, options) {
-        if (viteCommand !== "serve") return;
-        if (id.includes("/node_modules/")) return;
-        const filepath = id.split("?")[0];
-        const extensionsRE = /\.(jsx?|tsx?|mdx?)$/;
-        if (!extensionsRE.test(filepath)) return;
-        const devRuntime = "react/jsx-dev-runtime";
-        const ssr = options?.ssr === true;
-        const isJSX = filepath.endsWith("x");
-        const useFastRefresh = !ssr && (isJSX || code.includes(devRuntime));
-        if (!useFastRefresh) return;
-        if (isVirtualClientRouteModuleId(id)) {
-          const routeId = routeIdByFile?.get(filepath);
-          return { code: addRefreshWrapper2({ routeId, code, id }) };
-        }
-        const result = await babel2.transformAsync(code, {
-          babelrc: false,
-          configFile: false,
-          filename: id,
-          sourceFileName: filepath,
-          parserOpts: {
-            sourceType: "module",
-            allowAwaitOutsideFunction: true
-          },
-          plugins: [[require("react-refresh/babel"), { skipEnvCheck: true }]],
-          sourceMaps: true
-        });
-        if (result === null) return;
-        code = result.code;
-        const refreshContentRE = /\$Refresh(?:Reg|Sig)\$\(/;
-        if (refreshContentRE.test(code)) {
-          code = addRefreshWrapper2({ code, id });
-        }
-        return { code, map: result.map };
-      }
-    },
-    {
-      name: "react-router/rsc/hmr/updates",
-      async hotUpdate({ server, file, modules }) {
-        if (this.environment.name !== "rsc") return;
-        const clientModules = server.environments.client.moduleGraph.getModulesByFile(file);
-        const vite2 = await import("vite");
-        const isServerOnlyChange = !clientModules || clientModules.size === 0 || // Handle CSS injected from server-first routes (with ?direct query
-        // string) since the client graph has a reference to the CSS
-        vite2.isCSSRequest(file) && Array.from(clientModules).some(
-          (mod) => mod.id?.includes("?direct")
-        );
-        for (const mod of getModulesWithImporters(modules)) {
-          if (!mod.file) continue;
-          const normalizedPath = import_pathe6.default.normalize(mod.file);
-          const routeId = routeIdByFile?.get(normalizedPath);
-          if (routeId !== void 0) {
-            const routeSource = await (0, import_promises4.readFile)(normalizedPath, "utf8");
-            const virtualRouteModuleCode = (await server.environments.rsc.pluginContainer.transform(
-              routeSource,
-              `${normalizedPath}?route-module`
-            )).code;
-            const { staticExports } = parseRouteExports(virtualRouteModuleCode);
-            const hasAction = staticExports.includes("action");
-            const hasComponent = staticExports.includes("default");
-            const hasErrorBoundary = staticExports.includes("ErrorBoundary");
-            const hasLoader = staticExports.includes("loader");
-            server.hot.send({
-              type: "custom",
-              event: "react-router:hmr",
-              data: {
-                routeId,
-                isServerOnlyChange,
-                hasAction,
-                hasComponent,
-                hasErrorBoundary,
-                hasLoader
-              }
-            });
-          }
-        }
-        return modules;
-      }
-    },
     {
       name: "react-router/rsc/virtual-react-router-serve-config",
       resolveId(id) {
@@ -6655,7 +6805,6 @@ var virtual2 = {
   routeConfig: create("unstable_rsc/routes"),
   routeDiscovery: create("unstable_rsc/route-discovery"),
   injectHmrRuntime: create("unstable_rsc/inject-hmr-runtime"),
-  hmrRuntime: create("unstable_rsc/runtime"),
   basename: create("unstable_rsc/basename"),
   reactRouterServeConfig: create("unstable_rsc/react-router-serve-config")
 };
@@ -6672,65 +6821,6 @@ function invalidateVirtualModules2(viteDevServer) {
 function getRootDirectory(viteUserConfig) {
   return viteUserConfig.root ?? process.env.REACT_ROUTER_ROOT ?? process.cwd();
 }
-function getModulesWithImporters(modules) {
-  const visited = /* @__PURE__ */ new Set();
-  const result = /* @__PURE__ */ new Set();
-  function walk(module2) {
-    if (visited.has(module2)) return;
-    visited.add(module2);
-    result.add(module2);
-    for (const importer of module2.importers) {
-      walk(importer);
-    }
-  }
-  for (const module2 of modules) {
-    walk(module2);
-  }
-  return result;
-}
-function addRefreshWrapper2({
-  routeId,
-  code,
-  id
-}) {
-  const acceptExports = routeId !== void 0 ? CLIENT_NON_COMPONENT_EXPORTS2 : [];
-  return REACT_REFRESH_HEADER2.replaceAll("__SOURCE__", JSON.stringify(id)) + code + REACT_REFRESH_FOOTER2.replaceAll("__SOURCE__", JSON.stringify(id)).replaceAll("__ACCEPT_EXPORTS__", JSON.stringify(acceptExports)).replaceAll("__ROUTE_ID__", JSON.stringify(routeId));
-}
-var REACT_REFRESH_HEADER2 = `
-import RefreshRuntime from "${virtual2.hmrRuntime.id}";
-
-const inWebWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope;
-let prevRefreshReg;
-let prevRefreshSig;
-
-if (import.meta.hot && !inWebWorker) {
-  if (!window.__vite_plugin_react_preamble_installed__) {
-    throw new Error(
-      "React Router Vite plugin can't detect preamble. Something is wrong."
-    );
-  }
-
-  prevRefreshReg = window.$RefreshReg$;
-  prevRefreshSig = window.$RefreshSig$;
-  window.$RefreshReg$ = (type, id) => {
-    RefreshRuntime.register(type, __SOURCE__ + " " + id)
-  };
-  window.$RefreshSig$ = RefreshRuntime.createSignatureFunctionForTransform;
-}`.replaceAll("\n", "");
-var REACT_REFRESH_FOOTER2 = `
-if (import.meta.hot && !inWebWorker) {
-  window.$RefreshReg$ = prevRefreshReg;
-  window.$RefreshSig$ = prevRefreshSig;
-  RefreshRuntime.__hmr_import(import.meta.url).then((currentExports) => {
-    RefreshRuntime.registerExportsForReactRefresh(__SOURCE__, currentExports);
-    import.meta.hot.accept((nextExports) => {
-      if (!nextExports) return;
-      __ROUTE_ID__ && window.__reactRouterRouteModuleUpdates.set(__ROUTE_ID__, nextExports);
-      const invalidateMessage = RefreshRuntime.validateRefreshBoundaryAndEnqueueUpdate(currentExports, nextExports, __ACCEPT_EXPORTS__);
-      if (invalidateMessage) import.meta.hot.invalidate(invalidateMessage);
-    });
-  });
-}`;
 var getClientBuildDirectory2 = (reactRouterConfig) => import_pathe6.default.join(reactRouterConfig.buildDirectory, "client");
 function getPrerenderConcurrencyConfig2(reactRouterConfig) {
   let concurrency = 1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-router/dev",
-  "version": "7.14.1",
+  "version": "7.14.2",
   "description": "Dev tools and CLI for React Router",
   "homepage": "https://reactrouter.com",
   "bugs": {
@@ -92,7 +92,7 @@
     "tinyglobby": "^0.2.14",
     "valibot": "^1.2.0",
     "vite-node": "^3.2.2",
-    "@react-router/node": "7.14.1"
+    "@react-router/node": "7.14.2"
   },
   "devDependencies": {
     "@types/babel__core": "^7.20.5",
@@ -116,8 +116,8 @@
     "vite": "^6.3.0",
     "wireit": "0.14.9",
     "wrangler": "^4.23.0",
-    "@react-router/serve": "7.14.1",
-    "react-router": "^7.14.1"
+    "@react-router/serve": "7.14.2",
+    "react-router": "^7.14.2"
   },
   "peerDependencies": {
     "@vitejs/plugin-rsc": "~0.5.21",
@@ -125,8 +125,8 @@
     "typescript": "^5.1.0 || ^6.0.0",
     "vite": "^5.1.0 || ^6.0.0 || ^7.0.0 || ^8.0.0",
     "wrangler": "^3.28.2 || ^4.0.0",
-    "react-router": "^7.14.1",
-    "@react-router/serve": "^7.14.1"
+    "@react-router/serve": "^7.14.2",
+    "react-router": "^7.14.2"
   },
   "peerDependenciesMeta": {
     "@vitejs/plugin-rsc": {