@react-router/dev 0.0.0-experimental-567b27f71 → 0.0.0-experimental-cb0fdf114

package/CHANGELOG.md

@@ -1,5 +1,56 @@
 # `@react-router/dev`
 
+## 7.13.2
+
+### Patch Changes
+
+- Fix `react-router dev` crash when Unix socket files exist in the project root ([#14854](https://github.com/remix-run/react-router/pull/14854))
+
+- Escape redirect locations in prerendered redirect HTML ([#14880](https://github.com/remix-run/react-router/pull/14880))
+
+- Add `future.unstable_passThroughRequests` flag ([#14775](https://github.com/remix-run/react-router/pull/14775))
+
+  By default, React Router normalizes the `request.url` passed to your `loader`, `action`, and `middleware` functions by removing React Router's internal implementation details (`.data` suffixes, `index` + `_routes` query params).
+
+  Enabling this flag removes that normalization and passes the raw HTTP `request` instance to your handlers. This provides a few benefits:
+  - Reduces server-side overhead by eliminating multiple `new Request()` calls on the critical path
+  - Allows you to distinguish document from data requests in your handlers base don the presence of a `.data` suffix (useful for observability purposes)
+
+  If you were previously relying on the normalization of `request.url`, you can switch to use the new sibling `unstable_url` parameter which contains a `URL` instance representing the normalized location:
+
+  ```tsx
+  // ❌ Before: you could assume there was no `.data` suffix in `request.url`
+  export async function loader({ request }: Route.LoaderArgs) {
+    let url = new URL(request.url);
+    if (url.pathname === "/path") {
+      // This check will fail with the flag enabled because the `.data` suffix will
+      // exist on data requests
+    }
+  }
+
+  // ✅ After: use `unstable_url` for normalized routing logic and `request.url`
+  // for raw routing logic
+  export async function loader({ request, unstable_url }: Route.LoaderArgs) {
+    if (unstable_url.pathname === "/path") {
+      // This will always have the `.data` suffix stripped
+    }
+
+    // And now you can distinguish between document versus data requests
+    let isDataRequest = new URL(request.url).pathname.endsWith(".data");
+  }
+  ```
+
+- Add a new `unstable_url: URL` parameter to route handler methods (`loader`, `action`, `middleware`, etc.) representing the normalized URL the application is navigating to or fetching, with React Router implementation details removed (`.data`suffix, `index`/`_routes` query params) ([#14775](https://github.com/remix-run/react-router/pull/14775))
+
+  This is being added alongside the new `future.unstable_passthroughRequests` future flag so that users still have a way to access the normalized URL when that flag is enabled and non-normalized `request`'s are being passed to your handlers. When adopting this flag, you will only need to start leveraging this new parameter if you are relying on the normalization of `request.url` in your application code.
+
+  If you don't have the flag enabled, then `unstable_url` will match `request.url`.
+
+- Updated dependencies:
+  - `react-router@7.13.2`
+  - `@react-router/node@7.13.2`
+  - `@react-router/serve@7.13.2`
+
 ## 7.13.1
 
 ### Patch Changes

package/dist/cli/index.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 /**
- * @react-router/dev v0.0.0-experimental-567b27f71
+ * @react-router/dev v0.0.0-experimental-cb0fdf114
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -511,7 +511,7 @@ async function resolveConfig({
     unstable_previewServerPrerendering: userAndPresetConfigs.future?.unstable_previewServerPrerendering ?? false,
     v8_middleware: userAndPresetConfigs.future?.v8_middleware ?? false,
     v8_splitRouteModules: userAndPresetConfigs.future?.v8_splitRouteModules ?? false,
-    v8_viteEnvironmentApi: userAndPresetConfigs.future?.v8_viteEnvironmentApi ?? false
+    v8_viteEnvironmentApi: (userAndPresetConfigs.future?.v8_viteEnvironmentApi || userAndPresetConfigs.future?.unstable_previewServerPrerendering) ?? false
   };
   let allowedActionOrigins = userAndPresetConfigs.allowedActionOrigins ?? false;
   let reactRouterConfig = deepFreeze({
@@ -587,13 +587,11 @@ async function createConfigLoader({
       if (!fsWatcher) {
         fsWatcher = import_chokidar.default.watch([root, appDirectory], {
           ignoreInitial: true,
-          ignored: (path10) => {
-            let dirname5 = import_pathe3.default.dirname(path10);
-            return !dirname5.startsWith(appDirectory) && // Ensure we're only watching files outside of the app directory
-            // that are at the root level, not nested in subdirectories
-            path10 !== root && // Watch the root directory itself
-            dirname5 !== root;
-          }
+          ignored: (path10) => isIgnoredByWatcher(path10, { root, appDirectory })
+        });
+        fsWatcher.on("error", (error) => {
+          let message = error instanceof Error ? error.message : String(error);
+          console.warn(import_picocolors.default.yellow(`File watcher error: ${message}`));
         });
         fsWatcher.on("all", async (...args) => {
           let [event, rawFilepath] = args;
@@ -734,6 +732,25 @@ function isEntryFileDependency(moduleGraph, entryFilepath, filepath, visited = /
   }
   return false;
 }
+function isIgnoredByWatcher(path10, { root, appDirectory }) {
+  let dirname5 = import_pathe3.default.dirname(path10);
+  let ignoredByPath = !dirname5.startsWith(appDirectory) && // Ensure we're only watching files outside of the app directory
+  // that are at the root level, not nested in subdirectories
+  path10 !== root && // Watch the root directory itself
+  dirname5 !== root;
+  if (ignoredByPath) {
+    return true;
+  }
+  try {
+    let stat = import_node_fs.default.statSync(path10, { throwIfNoEntry: false });
+    if (stat && !stat.isFile() && !stat.isDirectory()) {
+      return true;
+    }
+  } catch {
+    return true;
+  }
+  return false;
+}
 var import_node_fs, import_node_child_process, import_pathe3, import_chokidar, import_picocolors, import_pick2, import_omit, import_cloneDeep, import_isEqual, excludedConfigPresetKeys, mergeReactRouterConfig, deepFreeze, entryExts;
 var init_config = __esm({
   "config/config.ts"() {
@@ -1166,7 +1183,7 @@ function getRouteAnnotations({
         module: Module
       }>
     ` + "\n\n" + generate(matchesType).code + "\n\n" + import_dedent.default`
-      type Annotations = GetAnnotations<Info & { module: Module, matches: Matches }, ${ctx.rsc}>;
+      type Annotations = GetAnnotations<Info & { module: Module, matches: Matches }>;
 
       export namespace Route {
         // links
@@ -1203,11 +1220,20 @@ function getRouteAnnotations({
         // HydrateFallback
         export type HydrateFallbackProps = Annotations["HydrateFallbackProps"];
 
+        // ServerHydrateFallback
+        export type ServerHydrateFallbackProps = Annotations["ServerHydrateFallbackProps"];
+
         // Component
         export type ComponentProps = Annotations["ComponentProps"];
 
+        // ServerComponent
+        export type ServerComponentProps = Annotations["ServerComponentProps"];
+
         // ErrorBoundary
         export type ErrorBoundaryProps = Annotations["ErrorBoundaryProps"];
+
+        // ServerErrorBoundary
+        export type ServerErrorBoundaryProps = Annotations["ServerErrorBoundaryProps"];
       }
     `;
   return { filename: filename2, content };
@@ -1353,7 +1379,8 @@ async function hasReactRouterRscPlugin({
   root,
   viteBuildOptions: { config, logLevel, mode }
 }) {
-  const vite2 = await import("vite");
+  await preloadVite();
+  const vite2 = getVite();
   const viteConfig = await vite2.resolveConfig(
     {
       configFile: config,
@@ -1375,6 +1402,7 @@ async function hasReactRouterRscPlugin({
 var init_has_rsc_plugin = __esm({
   "vite/has-rsc-plugin.ts"() {
     "use strict";
+    init_vite();
   }
 });
 
@@ -2289,12 +2317,16 @@ async function dev2(root, options = {}) {
 var clientEntries = ["entry.client.tsx", "entry.client.js", "entry.client.jsx"];
 var serverEntries = ["entry.server.tsx", "entry.server.js", "entry.server.jsx"];
 var entries = ["entry.client", "entry.server"];
+var rscEntries = ["entry.client", "entry.rsc", "entry.ssr"];
 var conjunctionListFormat = new Intl.ListFormat("en", {
   style: "long",
   type: "conjunction"
 });
 async function generateEntry(entry, rootDirectory, flags = {}) {
   rootDirectory = resolveRootDirectory(rootDirectory, flags);
+  let configDir = "defaults";
+  let entriesToUse = entries;
+  let isRsc = false;
   if (await hasReactRouterRscPlugin({
     root: rootDirectory,
     viteBuildOptions: {
@@ -2302,12 +2334,15 @@ async function generateEntry(entry, rootDirectory, flags = {}) {
       mode: flags.mode
     }
   })) {
-    console.error(
-      import_picocolors8.default.red(
-        `The reveal command is currently not supported in RSC Framework Mode.`
-      )
-    );
-    process.exit(1);
+    if (!entry) {
+      await generateEntry("entry.client", rootDirectory, flags);
+      await generateEntry("entry.rsc", rootDirectory, flags);
+      await generateEntry("entry.ssr", rootDirectory, flags);
+      return;
+    }
+    configDir = "default-rsc-entries";
+    entriesToUse = rscEntries;
+    isRsc = true;
   }
   if (!entry) {
     await generateEntry("entry.client", rootDirectory, flags);
@@ -2323,46 +2358,65 @@ async function generateEntry(entry, rootDirectory, flags = {}) {
     return;
   }
   let appDirectory = configResult.value.appDirectory;
-  if (!entries.includes(entry)) {
-    let entriesArray = Array.from(entries);
+  if (!entriesToUse.includes(entry)) {
+    let entriesArray = Array.from(entriesToUse);
     let list = conjunctionListFormat.format(entriesArray);
     console.error(
       import_picocolors8.default.red(`Invalid entry file. Valid entry files are ${list}`)
     );
     return;
   }
-  let { readPackageJSON } = await import("pkg-types");
-  let pkgJson = await readPackageJSON(rootDirectory);
-  let deps = pkgJson.dependencies ?? {};
-  if (!deps["@react-router/node"]) {
-    console.error(import_picocolors8.default.red(`No default server entry detected.`));
-    return;
-  }
   let defaultsDirectory = path9.resolve(
     path9.dirname(require.resolve("@react-router/dev/package.json")),
     "dist",
     "config",
-    "defaults"
-  );
-  let defaultEntryClient = path9.resolve(defaultsDirectory, "entry.client.tsx");
-  let defaultEntryServer = path9.resolve(
-    defaultsDirectory,
-    `entry.server.node.tsx`
+    configDir
   );
-  let isServerEntry = entry === "entry.server";
-  let contents = isServerEntry ? await createServerEntry(rootDirectory, appDirectory, defaultEntryServer) : await createClientEntry(rootDirectory, appDirectory, defaultEntryClient);
-  let useTypeScript = flags.typescript ?? true;
-  let outputExtension = useTypeScript ? "tsx" : "jsx";
-  let outputEntry = `${entry}.${outputExtension}`;
-  let outputFile = path9.resolve(appDirectory, outputEntry);
-  if (!useTypeScript) {
-    let javascript = await transpile(contents, {
-      cwd: rootDirectory,
-      filename: isServerEntry ? defaultEntryServer : defaultEntryClient
-    });
-    await (0, import_promises4.writeFile)(outputFile, javascript, "utf-8");
+  let outputFile;
+  if (isRsc) {
+    let defaultEntry = path9.resolve(defaultsDirectory, `${entry}.tsx`);
+    outputFile = path9.resolve(appDirectory, `${entry}.tsx`);
+    if ((0, import_node_fs4.existsSync)(outputFile)) {
+      let relative7 = path9.relative(rootDirectory, outputFile);
+      console.error(import_picocolors8.default.red(`Entry file ${relative7} already exists.`));
+      return;
+    }
+    await (0, import_promises4.copyFile)(defaultEntry, outputFile);
   } else {
-    await (0, import_promises4.writeFile)(outputFile, contents, "utf-8");
+    let { readPackageJSON } = await import("pkg-types");
+    let pkgJson = await readPackageJSON(rootDirectory);
+    let deps = pkgJson.dependencies ?? {};
+    if (!deps["@react-router/node"]) {
+      console.error(import_picocolors8.default.red(`No default server entry detected.`));
+      return;
+    }
+    let defaultEntryClient = path9.resolve(
+      defaultsDirectory,
+      "entry.client.tsx"
+    );
+    let defaultEntryServer = path9.resolve(
+      defaultsDirectory,
+      `entry.server.node.tsx`
+    );
+    let isServerEntry = entry === "entry.server";
+    let contents = isServerEntry ? await createServerEntry(rootDirectory, appDirectory, defaultEntryServer) : await createClientEntry(
+      rootDirectory,
+      appDirectory,
+      defaultEntryClient
+    );
+    let useTypeScript = flags.typescript ?? true;
+    let outputExtension = useTypeScript ? "tsx" : "jsx";
+    let outputEntry = `${entry}.${outputExtension}`;
+    outputFile = path9.resolve(appDirectory, outputEntry);
+    if (!useTypeScript) {
+      let javascript = await transpile(contents, {
+        cwd: rootDirectory,
+        filename: isServerEntry ? defaultEntryServer : defaultEntryClient
+      });
+      await (0, import_promises4.writeFile)(outputFile, javascript, "utf-8");
+    } else {
+      await (0, import_promises4.writeFile)(outputFile, contents, "utf-8");
+    }
   }
   console.log(
     import_picocolors8.default.blue(

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

@@ -24,7 +24,6 @@ setServerCallback(
 );
 
 createFromReadableStream<RSCPayload>(getRSCStream()).then((payload) => {
-  // @ts-expect-error - on 18 types, requires 19.
   startTransition(async () => {
     const formState =
       payload.type === "render" ? await payload.formState : undefined;
@@ -33,12 +32,11 @@ createFromReadableStream<RSCPayload>(getRSCStream()).then((payload) => {
       document,
       <StrictMode>
         <RSCHydratedRouter
-          payload={payload}
           createFromReadableStream={createFromReadableStream}
+          payload={payload}
         />
       </StrictMode>,
       {
-        // @ts-expect-error - no types for this yet
         formState,
       },
     );

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

@@ -13,6 +13,7 @@ import {
 
 // Import the routes generated by routes.ts
 import routes from "virtual:react-router/unstable_rsc/routes";
+import routeDiscovery from "virtual:react-router/unstable_rsc/route-discovery";
 import basename from "virtual:react-router/unstable_rsc/basename";
 import unstable_reactRouterServeConfig from "virtual:react-router/unstable_rsc/react-router-serve-config";
 
@@ -35,6 +36,8 @@ export function fetchServer(
     requestContext,
     // The app routes.
     routes,
+    // The route discovery configuration.
+    routeDiscovery,
     // Encode the match with the React Server implementation.
     generateResponse(match, options) {
       return new Response(renderToReadableStream(match.payload, options), {

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

@@ -1,5 +1,4 @@
 import { createFromReadableStream } from "@vitejs/plugin-rsc/ssr";
-// @ts-expect-error - no types for this, can import from root once on latest 19
 import { renderToReadableStream } from "react-dom/server.edge";
 import {
   unstable_routeRSCServerRequest as routeRSCServerRequest,

package/dist/config.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v0.0.0-experimental-567b27f71
+ * @react-router/dev v0.0.0-experimental-cb0fdf114
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/routes.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v0.0.0-experimental-567b27f71
+ * @react-router/dev v0.0.0-experimental-cb0fdf114
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/vite/cloudflare.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v0.0.0-experimental-567b27f71
+ * @react-router/dev v0.0.0-experimental-cb0fdf114
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -537,7 +537,7 @@ async function resolveConfig({
     unstable_previewServerPrerendering: userAndPresetConfigs.future?.unstable_previewServerPrerendering ?? false,
     v8_middleware: userAndPresetConfigs.future?.v8_middleware ?? false,
     v8_splitRouteModules: userAndPresetConfigs.future?.v8_splitRouteModules ?? false,
-    v8_viteEnvironmentApi: userAndPresetConfigs.future?.v8_viteEnvironmentApi ?? false
+    v8_viteEnvironmentApi: (userAndPresetConfigs.future?.v8_viteEnvironmentApi || userAndPresetConfigs.future?.unstable_previewServerPrerendering) ?? false
   };
   let allowedActionOrigins = userAndPresetConfigs.allowedActionOrigins ?? false;
   let reactRouterConfig = deepFreeze({
@@ -613,13 +613,11 @@ async function createConfigLoader({
       if (!fsWatcher) {
         fsWatcher = import_chokidar.default.watch([root, appDirectory], {
           ignoreInitial: true,
-          ignored: (path3) => {
-            let dirname = import_pathe3.default.dirname(path3);
-            return !dirname.startsWith(appDirectory) && // Ensure we're only watching files outside of the app directory
-            // that are at the root level, not nested in subdirectories
-            path3 !== root && // Watch the root directory itself
-            dirname !== root;
-          }
+          ignored: (path3) => isIgnoredByWatcher(path3, { root, appDirectory })
+        });
+        fsWatcher.on("error", (error) => {
+          let message = error instanceof Error ? error.message : String(error);
+          console.warn(import_picocolors.default.yellow(`File watcher error: ${message}`));
         });
         fsWatcher.on("all", async (...args) => {
           let [event, rawFilepath] = args;
@@ -761,6 +759,25 @@ function isEntryFileDependency(moduleGraph, entryFilepath, filepath, visited = /
   }
   return false;
 }
+function isIgnoredByWatcher(path3, { root, appDirectory }) {
+  let dirname = import_pathe3.default.dirname(path3);
+  let ignoredByPath = !dirname.startsWith(appDirectory) && // Ensure we're only watching files outside of the app directory
+  // that are at the root level, not nested in subdirectories
+  path3 !== root && // Watch the root directory itself
+  dirname !== root;
+  if (ignoredByPath) {
+    return true;
+  }
+  try {
+    let stat = import_node_fs.default.statSync(path3, { throwIfNoEntry: false });
+    if (stat && !stat.isFile() && !stat.isDirectory()) {
+      return true;
+    }
+  } catch {
+    return true;
+  }
+  return false;
+}
 
 // vite/cloudflare-dev-proxy.ts
 var serverBuildId = "virtual:react-router/server-build";