fix(dev/typegen): fix non-JS/TS files

.changeset/moody-eagles-deny.md

@@ -0,0 +1,5 @@
+---
+"@react-router/dev": patch
+---
+
+Support `moduleResolution` `Node16` and `NodeNext` for non-JS files.

contributors.yml

@@ -240,6 +240,7 @@
 - Nismit
 - nnhjs
 - noisypigeon
+- nowells
 - Nurai1
 - Obi-Dann
 - OlegDev1

packages/react-router-dev/typegen/generate.ts

@@ -1,13 +1,18 @@
 import ts from "dedent";
 import * as Path from "pathe";
-import * as Pathe from "pathe/utils";
 
 import { type RouteManifestEntry } from "../config/routes";
 import { type Context } from "./context";
 import { getTypesPath } from "./paths";
 import * as Params from "./params";
 import * as Route from "./route";
 
+function getTypescriptSafePath(path: string) {
+  // In typescript, we want to support "moduleResolution": "nodenext" as well as not having "allowImportingTsExtensions": true,
+  // so we normalize all JS like files to `.js`, but allow other extensions such as `.mdx` and others that might be used as routes.
+  return path.replace(/\.(js|ts)x?$/, ".js");
+}
+
 export function generate(ctx: Context, route: RouteManifestEntry): string {
   const lineage = Route.lineage(ctx.config.routes, route);
   const fullpath = Route.fullpath(lineage);
@@ -22,9 +27,9 @@ export function generate(ctx: Context, route: RouteManifestEntry): string {
       );
 
       const indent = i === 0 ? "" : "  ".repeat(2);
-      let source = noExtension(rel);
+      let source = getTypescriptSafePath(rel);
       if (!source.startsWith("../")) source = "./" + source;
-      return `${indent}import type { Info as Parent${i} } from "${source}.js"`;
+      return `${indent}import type { Info as Parent${i} } from "${source}"`;
     })
     .join("\n");
 
@@ -36,7 +41,7 @@ export function generate(ctx: Context, route: RouteManifestEntry): string {
 
     ${parentTypeImports}
 
-    type Module = typeof import("../${Pathe.filename(route.file)}.js")
+    type Module = typeof import("../${getTypescriptSafePath(Path.basename(route.file))}")
 
     export type Info = {
       parents: [${parents.map((_, i) => `Parent${i}`).join(", ")}],
@@ -76,9 +81,6 @@ export function generate(ctx: Context, route: RouteManifestEntry): string {
   `;
 }
 
-const noExtension = (path: string) =>
-  Path.join(Path.dirname(path), Pathe.filename(path));
-
 function formatParamProperties(fullpath: string) {
   const params = Params.parse(fullpath);
   const properties = Object.entries(params).map(([name, isRequired]) =>