@bleedingdev/modern-js-plugin-tanstack 3.2.0-ultramodern.5 → 3.2.0-ultramodern.50

package/dist/cjs/cli/index.js

@@ -159,13 +159,10 @@ declare module '${opts.runtimeModule}' {
                         plugins
                     };
                 });
-                api.checkEntryPoint(({ path: entryPath, entry })=>{
-                    const { isRouteEntry } = getRuntimeRouterCli();
-                    return {
+                api.checkEntryPoint(({ path: entryPath, entry })=>({
                         path: entryPath,
-                        entry: entry || isRouteEntry(entryPath, routesDir)
-                    };
-                });
+                        entry: entry || getRuntimeRouterCli().isRouteEntry(entryPath, routesDir)
+                    }));
                 api.config(()=>({
                         source: {
                             include: [

package/dist/cjs/cli/tanstackTypes.js

@@ -127,6 +127,7 @@ async function generateTanstackRouterTypesSourceForEntry(opts) {
     const imports = [];
     const statements = [];
     const loaderImportMap = new Map();
+    const usedRouteVarNames = new Set();
     let loaderIndex = 0;
     let routeIndex = 0;
     const getImportNamesForLoader = async (aliasedNoExtPath, inline, hasAction)=>{
@@ -160,10 +161,17 @@ async function generateTanstackRouterTypesSourceForEntry(opts) {
             actionName
         };
     };
+    const reserveRouteVarName = (preferred)=>{
+        let candidate = preferred;
+        let suffix = 1;
+        while(usedRouteVarNames.has(candidate))candidate = `${preferred}_${suffix++}`;
+        usedRouteVarNames.add(candidate);
+        return candidate;
+    };
     const createRouteVarName = (route)=>{
         const id = route.id;
         const base = id ? makeLegalIdentifier(id) : `r_${routeIndex++}`;
-        return `route_${base}`;
+        return reserveRouteVarName(`route_${base}`);
     };
     const buildRoute = async (opts)=>{
         const { parentVar, route } = opts;
@@ -192,14 +200,16 @@ async function generateTanstackRouterTypesSourceForEntry(opts) {
             actionName
         });
         if (staticDataSnippet) routeOpts.push(staticDataSnippet);
-        statements.push(`const ${varName} = createRoute({\n  ${routeOpts.join('\n  ')}\n});`);
         const children = route.children;
+        const hasChildren = Boolean(children && children.length > 0);
+        const routeCtorVarName = hasChildren ? reserveRouteVarName(`${varName}__base`) : varName;
+        statements.push(`const ${routeCtorVarName} = createRoute({\n  ${routeOpts.join('\n  ')}\n});`);
         if (children && children.length > 0) {
             const childVars = await Promise.all(children.map((child)=>buildRoute({
-                    parentVar: varName,
+                    parentVar: routeCtorVarName,
                     route: child
                 })));
-            statements.push(`${varName}.addChildren([${childVars.join(', ')}]);`);
+            statements.push(`const ${varName} = ${routeCtorVarName}.addChildren([${childVars.join(', ')}]);`);
         }
         return varName;
     };
@@ -272,7 +282,11 @@ function createRouteStaticData(opts: {
   modernRouteAction?: unknown;
   modernRouteLoader?: unknown;
 }) {
-  const staticData: Record<string, unknown> = {};
+  const staticData: {
+    modernRouteId?: string;
+    modernRouteAction?: unknown;
+    modernRouteLoader?: unknown;
+  } = {};
 
   if (opts.modernRouteId) {
     staticData.modernRouteId = opts.modernRouteId;
@@ -286,7 +300,7 @@ function createRouteStaticData(opts: {
     staticData.modernRouteAction = opts.modernRouteAction;
   }
 
-  return Object.keys(staticData).length > 0 ? staticData : undefined;
+  return staticData;
 }
 
 function modernLoaderToTanstack<TLoader extends (args: any) => any>(

package/dist/cjs/runtime/plugin.js

@@ -37,6 +37,7 @@ const external_react_namespaceObject = require("react");
 const external_basepathRewrite_js_namespaceObject = require("./basepathRewrite.js");
 const external_hooks_js_namespaceObject = require("./hooks.js");
 const external_lifecycle_js_namespaceObject = require("./lifecycle.js");
+const external_prefetchLink_js_namespaceObject = require("./prefetchLink.js");
 const external_routeTree_js_namespaceObject = require("./routeTree.js");
 const client_js_namespaceObject = require("./rsc/client.js");
 const external_utils_js_namespaceObject = require("./utils.js");
@@ -102,6 +103,7 @@ const tanstackRouterPlugin = (userConfig = {})=>{
                     }
                 }
                 context.router = {
+                    Link: external_prefetchLink_js_namespaceObject.Link,
                     useMatches: react_router_namespaceObject.useMatches,
                     useLocation: react_router_namespaceObject.useLocation,
                     useNavigate: react_router_namespaceObject.useNavigate,

package/dist/cjs/runtime/plugin.node.js

@@ -34,7 +34,7 @@ const node_namespaceObject = require("@modern-js/runtime-utils/node");
 const time_namespaceObject = require("@modern-js/runtime-utils/time");
 const constants_namespaceObject = require("@modern-js/utils/universal/constants");
 const react_router_namespaceObject = require("@tanstack/react-router");
-const server_namespaceObject = require("@tanstack/react-router/ssr/server");
+const server_namespaceObject = require("@tanstack/router-core/ssr/server");
 const external_react_namespaceObject = require("react");
 const external_basepathRewrite_js_namespaceObject = require("./basepathRewrite.js");
 const external_hooks_js_namespaceObject = require("./hooks.js");
@@ -46,12 +46,28 @@ const setTanstackRscServerPayload = (payload)=>{
     const storageContext = node_namespaceObject.storage.useContext?.();
     if (storageContext) storageContext.serverPayload = payload;
 };
+function isPromiseLike(value) {
+    return Boolean(value && 'function' == typeof value.then);
+}
 function isPreloadableRouteComponent(component) {
     if (!component || 'function' != typeof component) return false;
     const preloadable = component;
     return 'function' == typeof preloadable.load || 'function' == typeof preloadable.preload;
 }
+function isReactLazyRouteComponent(component) {
+    return Boolean(component) && 'object' == typeof component && 'function' == typeof component._init && '_payload' in component;
+}
+async function preloadReactLazyRouteComponent(component) {
+    try {
+        component._init?.(component._payload);
+    } catch (thrown) {
+        if (!isPromiseLike(thrown)) throw thrown;
+        await thrown;
+        component._init?.(component._payload);
+    }
+}
 async function preloadRouteComponent(component) {
+    if (isReactLazyRouteComponent(component)) return void await preloadReactLazyRouteComponent(component);
     if (!isPreloadableRouteComponent(component)) return;
     if ('function' == typeof component.load) return void await component.load({});
     await component.preload?.({});

package/dist/cjs/runtime/plugin.worker.js

@@ -0,0 +1,49 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.n = (module)=>{
+        var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
+        __webpack_require__.d(getter, {
+            a: getter
+        });
+        return getter;
+    };
+})();
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    default: ()=>external_plugin_node_js_default(),
+    tanstackRouterPlugin: ()=>external_plugin_node_js_namespaceObject.tanstackRouterPlugin
+});
+const external_plugin_node_js_namespaceObject = require("./plugin.node.js");
+var external_plugin_node_js_default = /*#__PURE__*/ __webpack_require__.n(external_plugin_node_js_namespaceObject);
+exports["default"] = __webpack_exports__["default"];
+exports.tanstackRouterPlugin = __webpack_exports__.tanstackRouterPlugin;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "default",
+    "tanstackRouterPlugin"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/runtime/routeTree.js

@@ -29,6 +29,7 @@ __webpack_require__.d(__webpack_exports__, {
     getModernRouteIdsFromMatches: ()=>getModernRouteIdsFromMatches
 });
 const react_router_namespaceObject = require("@tanstack/react-router");
+const external_react_namespaceObject = require("react");
 const external_DefaultNotFound_js_namespaceObject = require("./DefaultNotFound.js");
 const payloadRouter_js_namespaceObject = require("./rsc/payloadRouter.js");
 function createTanstackRoute(options) {
@@ -84,6 +85,33 @@ function normalizeModernLoaderResponse(result) {
     }
     return normalizeModernLoaderResult(result);
 }
+function pickRouteModuleComponent(routeModule) {
+    if ('function' == typeof routeModule || routeModule && 'object' == typeof routeModule && '$$typeof' in routeModule) return routeModule;
+    if (!routeModule || 'object' != typeof routeModule) return;
+    const module = routeModule;
+    const component = module.default || module.Component;
+    if ('function' == typeof component || component && 'object' == typeof component && '$$typeof' in component) return component;
+}
+function createServerLazyImportComponent(lazyImport, fallbackComponent) {
+    if ("u" > typeof document) return fallbackComponent;
+    let resolvedComponent;
+    let pendingLoad;
+    const load = async ()=>{
+        if (resolvedComponent) return resolvedComponent;
+        const routeModule = await lazyImport();
+        const component = pickRouteModuleComponent(routeModule);
+        if (component) resolvedComponent = component;
+        return resolvedComponent;
+    };
+    const Component = (props)=>{
+        if (resolvedComponent) return (0, external_react_namespaceObject.createElement)(resolvedComponent, props);
+        pendingLoad ||= load();
+        throw pendingLoad;
+    };
+    Component.load = load;
+    Component.preload = load;
+    return Component;
+}
 function isAbsoluteUrl(value) {
     try {
         new URL(value);
@@ -258,10 +286,18 @@ function wrapRouteObjectLoader(route, revalidationState, options = {}) {
 }
 function toRouteComponent(routeObject) {
     const route = routeObject;
+    const lazyImport = 'function' == typeof route.lazyImport ? route.lazyImport : void 0;
+    const fallbackComponent = route.Component ? route.Component : route.element ? ()=>route.element : void 0;
+    if (lazyImport && fallbackComponent) return createServerLazyImportComponent(lazyImport, fallbackComponent);
     if (route.Component) return route.Component;
     const element = route.element;
     if (element) return ()=>element;
 }
+function toModernRouteComponent(route) {
+    const component = route.component || void 0;
+    if ('function' == typeof route.lazyImport && component) return createServerLazyImportComponent(route.lazyImport, component);
+    return component;
+}
 function toErrorComponent(routeObject) {
     const route = routeObject;
     if (route.ErrorBoundary) return route.ErrorBoundary;
@@ -342,7 +378,7 @@ function createRouteFromModernRoute(opts) {
     const stableFallbackId = modernId || route._component || route.filename || route.data || ('function' == typeof route.loader ? route.id : void 0);
     const pendingComponent = route.loading || route.pendingComponent;
     const errorComponent = route.error || route.errorComponent;
-    const component = route.component;
+    const component = toModernRouteComponent(route);
     const modernLoader = route.loader;
     const modernAction = route.action;
     const modernShouldRevalidate = route.shouldRevalidate;
@@ -389,7 +425,7 @@ function createRouteFromModernRoute(opts) {
 }
 function createRouteTreeFromModernRoutes(routes, options = {}) {
     const rootModern = routes.find((r)=>r && 'nested' === r.type && r.isRoot);
-    const rootComponent = rootModern?.component;
+    const rootComponent = rootModern ? toModernRouteComponent(rootModern) : void 0;
     const pendingComponent = rootModern?.loading;
     const errorComponent = rootModern?.error;
     const rootLoader = rootModern?.loader;

package/dist/esm/cli/index.mjs

@@ -108,13 +108,10 @@ function tanstackRouterPlugin(options = {}) {
                     plugins
                 };
             });
-            api.checkEntryPoint(({ path: entryPath, entry })=>{
-                const { isRouteEntry } = getRuntimeRouterCli();
-                return {
+            api.checkEntryPoint(({ path: entryPath, entry })=>({
                     path: entryPath,
-                    entry: entry || isRouteEntry(entryPath, routesDir)
-                };
-            });
+                    entry: entry || getRuntimeRouterCli().isRouteEntry(entryPath, routesDir)
+                }));
             api.config(()=>({
                     source: {
                         include: [

package/dist/esm/cli/tanstackTypes.mjs

@@ -88,6 +88,7 @@ async function generateTanstackRouterTypesSourceForEntry(opts) {
     const imports = [];
     const statements = [];
     const loaderImportMap = new Map();
+    const usedRouteVarNames = new Set();
     let loaderIndex = 0;
     let routeIndex = 0;
     const getImportNamesForLoader = async (aliasedNoExtPath, inline, hasAction)=>{
@@ -121,10 +122,17 @@ async function generateTanstackRouterTypesSourceForEntry(opts) {
             actionName
         };
     };
+    const reserveRouteVarName = (preferred)=>{
+        let candidate = preferred;
+        let suffix = 1;
+        while(usedRouteVarNames.has(candidate))candidate = `${preferred}_${suffix++}`;
+        usedRouteVarNames.add(candidate);
+        return candidate;
+    };
     const createRouteVarName = (route)=>{
         const id = route.id;
         const base = id ? makeLegalIdentifier(id) : `r_${routeIndex++}`;
-        return `route_${base}`;
+        return reserveRouteVarName(`route_${base}`);
     };
     const buildRoute = async (opts)=>{
         const { parentVar, route } = opts;
@@ -153,14 +161,16 @@ async function generateTanstackRouterTypesSourceForEntry(opts) {
             actionName
         });
         if (staticDataSnippet) routeOpts.push(staticDataSnippet);
-        statements.push(`const ${varName} = createRoute({\n  ${routeOpts.join('\n  ')}\n});`);
         const children = route.children;
+        const hasChildren = Boolean(children && children.length > 0);
+        const routeCtorVarName = hasChildren ? reserveRouteVarName(`${varName}__base`) : varName;
+        statements.push(`const ${routeCtorVarName} = createRoute({\n  ${routeOpts.join('\n  ')}\n});`);
         if (children && children.length > 0) {
             const childVars = await Promise.all(children.map((child)=>buildRoute({
-                    parentVar: varName,
+                    parentVar: routeCtorVarName,
                     route: child
                 })));
-            statements.push(`${varName}.addChildren([${childVars.join(', ')}]);`);
+            statements.push(`const ${varName} = ${routeCtorVarName}.addChildren([${childVars.join(', ')}]);`);
         }
         return varName;
     };
@@ -233,7 +243,11 @@ function createRouteStaticData(opts: {
   modernRouteAction?: unknown;
   modernRouteLoader?: unknown;
 }) {
-  const staticData: Record<string, unknown> = {};
+  const staticData: {
+    modernRouteId?: string;
+    modernRouteAction?: unknown;
+    modernRouteLoader?: unknown;
+  } = {};
 
   if (opts.modernRouteId) {
     staticData.modernRouteId = opts.modernRouteId;
@@ -247,7 +261,7 @@ function createRouteStaticData(opts: {
     staticData.modernRouteAction = opts.modernRouteAction;
   }
 
-  return Object.keys(staticData).length > 0 ? staticData : undefined;
+  return staticData;
 }
 
 function modernLoaderToTanstack<TLoader extends (args: any) => any>(

package/dist/esm/runtime/plugin.mjs

@@ -7,6 +7,7 @@ import { RouterClient } from "@tanstack/react-router/ssr/client";
 import { createModernBasepathRewrite } from "./basepathRewrite.mjs";
 import { modifyRoutes, onAfterCreateRouter, onAfterHydrateRouter, onBeforeCreateRouter, onBeforeCreateRoutes, onBeforeHydrateRouter } from "./hooks.mjs";
 import { applyRouterRuntimeState } from "./lifecycle.mjs";
+import { Link } from "./prefetchLink.mjs";
 import { createRouteTreeFromRouteObjects } from "./routeTree.mjs";
 import { getTanstackRscSerializationAdapters } from "./rsc/client.mjs";
 import { createRouteObjectsFromConfig, urlJoin } from "./utils.mjs";
@@ -73,6 +74,7 @@ const tanstackRouterPlugin = (userConfig = {})=>{
                     }
                 }
                 context.router = {
+                    Link: Link,
                     useMatches: useMatches,
                     useLocation: useLocation,
                     useNavigate: useNavigate,

package/dist/esm/runtime/plugin.node.mjs

@@ -5,7 +5,7 @@ import { createRequestContext, storage } from "@modern-js/runtime-utils/node";
 import { time } from "@modern-js/runtime-utils/time";
 import { LOADER_REPORTER_NAME } from "@modern-js/utils/universal/constants";
 import { RouterProvider, createMemoryHistory, createRouter } from "@tanstack/react-router";
-import { attachRouterServerSsrUtils } from "@tanstack/react-router/ssr/server";
+import { attachRouterServerSsrUtils } from "@tanstack/router-core/ssr/server";
 import { Suspense, useContext } from "react";
 import { createModernBasepathRewrite } from "./basepathRewrite.mjs";
 import { modifyRoutes, onAfterCreateRouter, onAfterHydrateRouter, onBeforeCreateRouter, onBeforeCreateRoutes, onBeforeHydrateRouter } from "./hooks.mjs";
@@ -17,12 +17,28 @@ const setTanstackRscServerPayload = (payload)=>{
     const storageContext = storage.useContext?.();
     if (storageContext) storageContext.serverPayload = payload;
 };
+function isPromiseLike(value) {
+    return Boolean(value && 'function' == typeof value.then);
+}
 function isPreloadableRouteComponent(component) {
     if (!component || 'function' != typeof component) return false;
     const preloadable = component;
     return 'function' == typeof preloadable.load || 'function' == typeof preloadable.preload;
 }
+function isReactLazyRouteComponent(component) {
+    return Boolean(component) && 'object' == typeof component && 'function' == typeof component._init && '_payload' in component;
+}
+async function preloadReactLazyRouteComponent(component) {
+    try {
+        component._init?.(component._payload);
+    } catch (thrown) {
+        if (!isPromiseLike(thrown)) throw thrown;
+        await thrown;
+        component._init?.(component._payload);
+    }
+}
 async function preloadRouteComponent(component) {
+    if (isReactLazyRouteComponent(component)) return void await preloadReactLazyRouteComponent(component);
     if (!isPreloadableRouteComponent(component)) return;
     if ('function' == typeof component.load) return void await component.load({});
     await component.preload?.({});

package/dist/esm/runtime/plugin.worker.mjs

@@ -0,0 +1 @@
+export { default, tanstackRouterPlugin } from "./plugin.node.mjs";

package/dist/esm/runtime/routeTree.mjs

@@ -1,4 +1,5 @@
 import { createRootRoute, createRoute, notFound, redirect } from "@tanstack/react-router";
+import { createElement } from "react";
 import { DefaultNotFound } from "./DefaultNotFound.mjs";
 import { isTanstackRscPayloadNavigationEnabled, loadTanstackRscRouteData } from "./rsc/payloadRouter.mjs";
 function createTanstackRoute(options) {
@@ -54,6 +55,33 @@ function normalizeModernLoaderResponse(result) {
     }
     return normalizeModernLoaderResult(result);
 }
+function pickRouteModuleComponent(routeModule) {
+    if ('function' == typeof routeModule || routeModule && 'object' == typeof routeModule && '$$typeof' in routeModule) return routeModule;
+    if (!routeModule || 'object' != typeof routeModule) return;
+    const module = routeModule;
+    const component = module.default || module.Component;
+    if ('function' == typeof component || component && 'object' == typeof component && '$$typeof' in component) return component;
+}
+function createServerLazyImportComponent(lazyImport, fallbackComponent) {
+    if ("u" > typeof document) return fallbackComponent;
+    let resolvedComponent;
+    let pendingLoad;
+    const load = async ()=>{
+        if (resolvedComponent) return resolvedComponent;
+        const routeModule = await lazyImport();
+        const component = pickRouteModuleComponent(routeModule);
+        if (component) resolvedComponent = component;
+        return resolvedComponent;
+    };
+    const Component = (props)=>{
+        if (resolvedComponent) return createElement(resolvedComponent, props);
+        pendingLoad ||= load();
+        throw pendingLoad;
+    };
+    Component.load = load;
+    Component.preload = load;
+    return Component;
+}
 function isAbsoluteUrl(value) {
     try {
         new URL(value);
@@ -228,10 +256,18 @@ function wrapRouteObjectLoader(route, revalidationState, options = {}) {
 }
 function toRouteComponent(routeObject) {
     const route = routeObject;
+    const lazyImport = 'function' == typeof route.lazyImport ? route.lazyImport : void 0;
+    const fallbackComponent = route.Component ? route.Component : route.element ? ()=>route.element : void 0;
+    if (lazyImport && fallbackComponent) return createServerLazyImportComponent(lazyImport, fallbackComponent);
     if (route.Component) return route.Component;
     const element = route.element;
     if (element) return ()=>element;
 }
+function toModernRouteComponent(route) {
+    const component = route.component || void 0;
+    if ('function' == typeof route.lazyImport && component) return createServerLazyImportComponent(route.lazyImport, component);
+    return component;
+}
 function toErrorComponent(routeObject) {
     const route = routeObject;
     if (route.ErrorBoundary) return route.ErrorBoundary;
@@ -312,7 +348,7 @@ function createRouteFromModernRoute(opts) {
     const stableFallbackId = modernId || route._component || route.filename || route.data || ('function' == typeof route.loader ? route.id : void 0);
     const pendingComponent = route.loading || route.pendingComponent;
     const errorComponent = route.error || route.errorComponent;
-    const component = route.component;
+    const component = toModernRouteComponent(route);
     const modernLoader = route.loader;
     const modernAction = route.action;
     const modernShouldRevalidate = route.shouldRevalidate;
@@ -359,7 +395,7 @@ function createRouteFromModernRoute(opts) {
 }
 function createRouteTreeFromModernRoutes(routes, options = {}) {
     const rootModern = routes.find((r)=>r && 'nested' === r.type && r.isRoot);
-    const rootComponent = rootModern?.component;
+    const rootComponent = rootModern ? toModernRouteComponent(rootModern) : void 0;
     const pendingComponent = rootModern?.loading;
     const errorComponent = rootModern?.error;
     const rootLoader = rootModern?.loader;

package/dist/esm-node/cli/index.mjs

@@ -112,13 +112,10 @@ function tanstackRouterPlugin(options = {}) {
                     plugins
                 };
             });
-            api.checkEntryPoint(({ path: entryPath, entry })=>{
-                const { isRouteEntry } = getRuntimeRouterCli();
-                return {
+            api.checkEntryPoint(({ path: entryPath, entry })=>({
                     path: entryPath,
-                    entry: entry || isRouteEntry(entryPath, routesDir)
-                };
-            });
+                    entry: entry || getRuntimeRouterCli().isRouteEntry(entryPath, routesDir)
+                }));
             api.config(()=>({
                     source: {
                         include: [

package/dist/esm-node/cli/tanstackTypes.mjs

@@ -89,6 +89,7 @@ async function generateTanstackRouterTypesSourceForEntry(opts) {
     const imports = [];
     const statements = [];
     const loaderImportMap = new Map();
+    const usedRouteVarNames = new Set();
     let loaderIndex = 0;
     let routeIndex = 0;
     const getImportNamesForLoader = async (aliasedNoExtPath, inline, hasAction)=>{
@@ -122,10 +123,17 @@ async function generateTanstackRouterTypesSourceForEntry(opts) {
             actionName
         };
     };
+    const reserveRouteVarName = (preferred)=>{
+        let candidate = preferred;
+        let suffix = 1;
+        while(usedRouteVarNames.has(candidate))candidate = `${preferred}_${suffix++}`;
+        usedRouteVarNames.add(candidate);
+        return candidate;
+    };
     const createRouteVarName = (route)=>{
         const id = route.id;
         const base = id ? makeLegalIdentifier(id) : `r_${routeIndex++}`;
-        return `route_${base}`;
+        return reserveRouteVarName(`route_${base}`);
     };
     const buildRoute = async (opts)=>{
         const { parentVar, route } = opts;
@@ -154,14 +162,16 @@ async function generateTanstackRouterTypesSourceForEntry(opts) {
             actionName
         });
         if (staticDataSnippet) routeOpts.push(staticDataSnippet);
-        statements.push(`const ${varName} = createRoute({\n  ${routeOpts.join('\n  ')}\n});`);
         const children = route.children;
+        const hasChildren = Boolean(children && children.length > 0);
+        const routeCtorVarName = hasChildren ? reserveRouteVarName(`${varName}__base`) : varName;
+        statements.push(`const ${routeCtorVarName} = createRoute({\n  ${routeOpts.join('\n  ')}\n});`);
         if (children && children.length > 0) {
             const childVars = await Promise.all(children.map((child)=>buildRoute({
-                    parentVar: varName,
+                    parentVar: routeCtorVarName,
                     route: child
                 })));
-            statements.push(`${varName}.addChildren([${childVars.join(', ')}]);`);
+            statements.push(`const ${varName} = ${routeCtorVarName}.addChildren([${childVars.join(', ')}]);`);
         }
         return varName;
     };
@@ -234,7 +244,11 @@ function createRouteStaticData(opts: {
   modernRouteAction?: unknown;
   modernRouteLoader?: unknown;
 }) {
-  const staticData: Record<string, unknown> = {};
+  const staticData: {
+    modernRouteId?: string;
+    modernRouteAction?: unknown;
+    modernRouteLoader?: unknown;
+  } = {};
 
   if (opts.modernRouteId) {
     staticData.modernRouteId = opts.modernRouteId;
@@ -248,7 +262,7 @@ function createRouteStaticData(opts: {
     staticData.modernRouteAction = opts.modernRouteAction;
   }
 
-  return Object.keys(staticData).length > 0 ? staticData : undefined;
+  return staticData;
 }
 
 function modernLoaderToTanstack<TLoader extends (args: any) => any>(

package/dist/esm-node/runtime/plugin.mjs

@@ -8,6 +8,7 @@ import { RouterClient } from "@tanstack/react-router/ssr/client";
 import { createModernBasepathRewrite } from "./basepathRewrite.mjs";
 import { modifyRoutes, onAfterCreateRouter, onAfterHydrateRouter, onBeforeCreateRouter, onBeforeCreateRoutes, onBeforeHydrateRouter } from "./hooks.mjs";
 import { applyRouterRuntimeState } from "./lifecycle.mjs";
+import { Link } from "./prefetchLink.mjs";
 import { createRouteTreeFromRouteObjects } from "./routeTree.mjs";
 import { getTanstackRscSerializationAdapters } from "./rsc/client.mjs";
 import { createRouteObjectsFromConfig, urlJoin } from "./utils.mjs";
@@ -74,6 +75,7 @@ const tanstackRouterPlugin = (userConfig = {})=>{
                     }
                 }
                 context.router = {
+                    Link: Link,
                     useMatches: useMatches,
                     useLocation: useLocation,
                     useNavigate: useNavigate,

package/dist/esm-node/runtime/plugin.node.mjs

@@ -6,7 +6,7 @@ import { createRequestContext, storage } from "@modern-js/runtime-utils/node";
 import { time } from "@modern-js/runtime-utils/time";
 import { LOADER_REPORTER_NAME } from "@modern-js/utils/universal/constants";
 import { RouterProvider, createMemoryHistory, createRouter } from "@tanstack/react-router";
-import { attachRouterServerSsrUtils } from "@tanstack/react-router/ssr/server";
+import { attachRouterServerSsrUtils } from "@tanstack/router-core/ssr/server";
 import { Suspense, useContext } from "react";
 import { createModernBasepathRewrite } from "./basepathRewrite.mjs";
 import { modifyRoutes, onAfterCreateRouter, onAfterHydrateRouter, onBeforeCreateRouter, onBeforeCreateRoutes, onBeforeHydrateRouter } from "./hooks.mjs";
@@ -18,12 +18,28 @@ const setTanstackRscServerPayload = (payload)=>{
     const storageContext = storage.useContext?.();
     if (storageContext) storageContext.serverPayload = payload;
 };
+function isPromiseLike(value) {
+    return Boolean(value && 'function' == typeof value.then);
+}
 function isPreloadableRouteComponent(component) {
     if (!component || 'function' != typeof component) return false;
     const preloadable = component;
     return 'function' == typeof preloadable.load || 'function' == typeof preloadable.preload;
 }
+function isReactLazyRouteComponent(component) {
+    return Boolean(component) && 'object' == typeof component && 'function' == typeof component._init && '_payload' in component;
+}
+async function preloadReactLazyRouteComponent(component) {
+    try {
+        component._init?.(component._payload);
+    } catch (thrown) {
+        if (!isPromiseLike(thrown)) throw thrown;
+        await thrown;
+        component._init?.(component._payload);
+    }
+}
 async function preloadRouteComponent(component) {
+    if (isReactLazyRouteComponent(component)) return void await preloadReactLazyRouteComponent(component);
     if (!isPreloadableRouteComponent(component)) return;
     if ('function' == typeof component.load) return void await component.load({});
     await component.preload?.({});

package/dist/esm-node/runtime/plugin.worker.mjs

@@ -0,0 +1,2 @@
+import "node:module";
+export { default, tanstackRouterPlugin } from "./plugin.node.mjs";