@bleedingdev/modern-js-runtime 3.2.0-ultramodern.17 → 3.2.0-ultramodern.22

package/dist/cjs/cli/ssr/index.js

@@ -125,13 +125,14 @@ const ssrBuilderPlugin = (modernAPI, outputModule, exportLoadablePath)=>({
                 const hasServerRendering = hasServerRenderingConfig(userConfig);
                 const hasModuleFederationRuntimeMarker = hasServerRendering && shouldUseModuleFederationNodeOutput(config);
                 const hasExplicitMfSsrFlag = isModuleFederationAppSSREnabled(userConfig);
+                const isCloudflareWorkerSSR = 'workerSSR' === name && userConfig.deploy?.target === 'cloudflare';
                 const requireExplicitMfSsrFlag = 'true' === process.env.MODERN_MF_APP_SSR_REQUIRE_EXPLICIT;
                 if (hasServerRendering && hasModuleFederationRuntimeMarker && !hasExplicitMfSsrFlag) {
                     const warningMessage = '[modernjs][mf-ssr] Module Federation SSR was auto-detected from runtime markers. Set server.ssr.moduleFederationAppSSR=true explicitly in host and remotes to avoid heuristic drift.';
                     if (requireExplicitMfSsrFlag) throw new Error(`${warningMessage} (enforced by MODERN_MF_APP_SSR_REQUIRE_EXPLICIT=true)`);
                     console.warn(warningMessage);
                 }
-                const isModuleFederationAppSSR = hasServerRendering && hasExplicitMfSsrFlag;
+                const isModuleFederationAppSSR = hasServerRendering && hasExplicitMfSsrFlag && !isCloudflareWorkerSSR;
                 const useModuleFederationNodeOutput = hasServerRendering && isModuleFederationAppSSR && isNodeEnvironmentTarget(config.output.target);
                 const ssrEnv = userConfig.deploy?.worker?.ssr || userConfig.server?.rsc ? 'edge' : 'node';
                 const appContext = modernAPI.getAppContext();
@@ -148,7 +149,7 @@ const ssrBuilderPlugin = (modernAPI, outputModule, exportLoadablePath)=>({
                 } : void 0;
                 const useLoadablePlugin = (0, utils_namespaceObject.isUseSSRBundle)(userConfig) && !isServerEnvironment && checkUseStringSSR(userConfig, appDirectory, entrypoints);
                 const outputConfig = {
-                    module: isServerEnvironment && !useModuleFederationNodeOutput && outputModule
+                    module: isServerEnvironment && !useModuleFederationNodeOutput && (outputModule || 'workerSSR' === name && userConfig.deploy?.target === 'cloudflare')
                 };
                 const useLoadableComponents = (0, utils_namespaceObject.isUseSSRBundle)(userConfig) && checkUseStringSSR(userConfig, appDirectory, entrypoints);
                 return mergeEnvironmentConfig(config, {

package/dist/cjs/core/server/helmet.js

@@ -27,8 +27,8 @@ __webpack_require__.d(__webpack_exports__, {
     createReplaceHelemt: ()=>createReplaceHelemt,
     helmetReplace: ()=>helmetReplace
 });
-const external_os_namespaceObject = require("os");
 const external_utils_js_namespaceObject = require("./utils.js");
+const EOL = '\n';
 const RE_HTML_ATTR = /<html[^>]*>/;
 const RE_BODY_ATTR = /<body[^>]*>/;
 const RE_LAST_IN_HEAD = /<\/head>/;
@@ -61,7 +61,7 @@ function helmetReplace(content, helmetData) {
         script,
         style,
         !existTitleTag ? title : ''
-    ].reduce((pre, cur)=>pre + (cur.length > 0 ? `  ${cur}${external_os_namespaceObject.EOL}` : ''), '');
+    ].reduce((pre, cur)=>pre + (cur.length > 0 ? `  ${cur}${EOL}` : ''), '');
     return (0, external_utils_js_namespaceObject.safeReplace)(result, RE_LAST_IN_HEAD, `${helmetStr}</head>`);
 }
 exports.createReplaceHelemt = __webpack_exports__.createReplaceHelemt;

package/dist/cjs/core/server/stream/beforeTemplate.worker.js

@@ -0,0 +1,105 @@
+"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__, {
+    buildShellBeforeTemplate: ()=>buildShellBeforeTemplate
+});
+const router_namespaceObject = require("@modern-js/runtime-utils/router");
+const external_react_helmet_namespaceObject = require("react-helmet");
+var external_react_helmet_default = /*#__PURE__*/ __webpack_require__.n(external_react_helmet_namespaceObject);
+const lifecycle_js_namespaceObject = require("../../../router/runtime/lifecycle.js");
+const external_constants_js_namespaceObject = require("../constants.js");
+const external_helmet_js_namespaceObject = require("../helmet.js");
+const external_shared_js_namespaceObject = require("../shared.js");
+const external_utils_js_namespaceObject = require("../utils.js");
+const checkIsInline = (chunk, enableInline)=>{
+    if ('production' !== process.env.NODE_ENV) return false;
+    if (enableInline instanceof RegExp) return enableInline.test(chunk);
+    return Boolean(enableInline);
+};
+async function buildShellBeforeTemplate(beforeAppTemplate, options) {
+    const { config, runtimeContext, styledComponentsStyleTags, entryName } = options;
+    const helmetData = external_react_helmet_default().renderStatic();
+    const callbacks = [
+        (0, external_helmet_js_namespaceObject.createReplaceHelemt)(helmetData),
+        (template)=>injectCss(template, entryName, styledComponentsStyleTags)
+    ];
+    return (0, external_shared_js_namespaceObject.buildHtml)(beforeAppTemplate, callbacks);
+    async function injectCss(template, entryName, styledComponentsStyleTags) {
+        let css = await getCssChunks();
+        if (styledComponentsStyleTags) css += styledComponentsStyleTags;
+        return (0, external_utils_js_namespaceObject.safeReplace)(template, external_constants_js_namespaceObject.CHUNK_CSS_PLACEHOLDER, css);
+        async function getCssChunks() {
+            const { routeManifest, routerContext, routes } = runtimeContext;
+            if (!routeManifest) return '';
+            const { routeAssets } = routeManifest;
+            let matchedRouteManifests;
+            const matchedRouteIds = (0, lifecycle_js_namespaceObject.getRouterMatchedRouteIds)(runtimeContext);
+            if (matchedRouteIds?.length) matchedRouteManifests = matchedRouteIds.map((routeId)=>routeAssets[routeId]).filter(Boolean);
+            else {
+                if (!routerContext || !routes) return '';
+                const matches = (0, router_namespaceObject.matchRoutes)(routes, routerContext.location, routerContext.basename);
+                matchedRouteManifests = matches?.map((match, index)=>{
+                    if (!index) return;
+                    const routeId = match.route.id;
+                    if (routeId) return routeAssets[routeId];
+                }).filter(Boolean);
+            }
+            const asyncEntry = routeAssets[`async-${entryName}`];
+            if (asyncEntry) matchedRouteManifests?.push(asyncEntry);
+            const cssChunks = matchedRouteManifests ? matchedRouteManifests.reduce((chunks, routeManifest)=>{
+                const { referenceCssAssets = [] } = routeManifest;
+                const _cssChunks = referenceCssAssets.filter((asset)=>asset?.endsWith('.css') && !template.includes(asset));
+                return [
+                    ...chunks,
+                    ..._cssChunks
+                ];
+            }, []) : [];
+            const { inlineStyles } = config;
+            const styles = cssChunks.map((chunk)=>{
+                const link = `<link href="${chunk}" rel="stylesheet" />`;
+                checkIsInline(chunk, inlineStyles);
+                return link;
+            });
+            return `${styles.join('')}`;
+        }
+    }
+}
+exports.buildShellBeforeTemplate = __webpack_exports__.buildShellBeforeTemplate;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "buildShellBeforeTemplate"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/router/cli/code/tanstackTypes.js

@@ -117,6 +117,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)=>{
@@ -150,10 +151,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 ? (0, external_makeLegalIdentifier_js_namespaceObject.makeLegalIdentifier)(id) : `r_${routeIndex++}`;
-        return `route_${base}`;
+        return reserveRouteVarName(`route_${base}`);
     };
     const buildRoute = async (opts)=>{
         const { parentVar, route } = opts;
@@ -182,14 +190,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;
     };

package/dist/cjs/router/runtime/tanstack/plugin.js

@@ -37,6 +37,7 @@ const external_hooks_js_namespaceObject = require("../hooks.js");
 const external_lifecycle_js_namespaceObject = require("../lifecycle.js");
 const external_utils_js_namespaceObject = require("../utils.js");
 const external_basepathRewrite_js_namespaceObject = require("./basepathRewrite.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 BLOCKING_SUBSCRIBE_SYMBOL = Symbol.for('@modern-js/plugin-runtime:tanstack-blocking-subscribe');
@@ -98,6 +99,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/router/runtime/tanstack/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");
 function createTanstackRoute(options) {
     return (0, react_router_namespaceObject.createRoute)(options);
@@ -73,6 +74,33 @@ function isModernDeferredData(value) {
 function normalizeModernLoaderResult(result) {
     return isModernDeferredData(result) ? result.data : 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 throwTanstackRedirect(location) {
     const target = location || '/';
     try {
@@ -239,10 +267,18 @@ function wrapRouteObjectLoader(route, revalidationState) {
 }
 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;
@@ -322,7 +358,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;
@@ -368,7 +404,7 @@ function createRouteFromModernRoute(opts) {
 }
 function createRouteTreeFromModernRoutes(routes) {
     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/cjs/rsc/server.worker.js

@@ -0,0 +1,58 @@
+"use strict";
+var __webpack_modules__ = {
+    "@modern-js/render/rsc-worker" (module) {
+        module.exports = require("@modern-js/render/rsc-worker");
+    }
+};
+var __webpack_module_cache__ = {};
+function __webpack_require__(moduleId) {
+    var cachedModule = __webpack_module_cache__[moduleId];
+    if (void 0 !== cachedModule) return cachedModule.exports;
+    var module = __webpack_module_cache__[moduleId] = {
+        exports: {}
+    };
+    __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+    return module.exports;
+}
+(()=>{
+    __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__);
+    var _modern_js_render_rsc_worker__rspack_import_0 = __webpack_require__("@modern-js/render/rsc-worker");
+    var __rspack_reexport = {};
+    for(const __rspack_import_key in _modern_js_render_rsc_worker__rspack_import_0)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_modern_js_render_rsc_worker__rspack_import_0[__rspack_import_key];
+    __webpack_require__.d(__webpack_exports__, __rspack_reexport);
+})();
+for(var __rspack_i in __webpack_exports__)exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/esm/cli/ssr/index.mjs

@@ -84,13 +84,14 @@ const ssrBuilderPlugin = (modernAPI, outputModule, exportLoadablePath)=>({
                 const hasServerRendering = hasServerRenderingConfig(userConfig);
                 const hasModuleFederationRuntimeMarker = hasServerRendering && shouldUseModuleFederationNodeOutput(config);
                 const hasExplicitMfSsrFlag = isModuleFederationAppSSREnabled(userConfig);
+                const isCloudflareWorkerSSR = 'workerSSR' === name && userConfig.deploy?.target === 'cloudflare';
                 const requireExplicitMfSsrFlag = 'true' === process.env.MODERN_MF_APP_SSR_REQUIRE_EXPLICIT;
                 if (hasServerRendering && hasModuleFederationRuntimeMarker && !hasExplicitMfSsrFlag) {
                     const warningMessage = '[modernjs][mf-ssr] Module Federation SSR was auto-detected from runtime markers. Set server.ssr.moduleFederationAppSSR=true explicitly in host and remotes to avoid heuristic drift.';
                     if (requireExplicitMfSsrFlag) throw new Error(`${warningMessage} (enforced by MODERN_MF_APP_SSR_REQUIRE_EXPLICIT=true)`);
                     console.warn(warningMessage);
                 }
-                const isModuleFederationAppSSR = hasServerRendering && hasExplicitMfSsrFlag;
+                const isModuleFederationAppSSR = hasServerRendering && hasExplicitMfSsrFlag && !isCloudflareWorkerSSR;
                 const useModuleFederationNodeOutput = hasServerRendering && isModuleFederationAppSSR && isNodeEnvironmentTarget(config.output.target);
                 const ssrEnv = userConfig.deploy?.worker?.ssr || userConfig.server?.rsc ? 'edge' : 'node';
                 const appContext = modernAPI.getAppContext();
@@ -107,7 +108,7 @@ const ssrBuilderPlugin = (modernAPI, outputModule, exportLoadablePath)=>({
                 } : void 0;
                 const useLoadablePlugin = isUseSSRBundle(userConfig) && !isServerEnvironment && checkUseStringSSR(userConfig, appDirectory, entrypoints);
                 const outputConfig = {
-                    module: isServerEnvironment && !useModuleFederationNodeOutput && outputModule
+                    module: isServerEnvironment && !useModuleFederationNodeOutput && (outputModule || 'workerSSR' === name && userConfig.deploy?.target === 'cloudflare')
                 };
                 const useLoadableComponents = isUseSSRBundle(userConfig) && checkUseStringSSR(userConfig, appDirectory, entrypoints);
                 return mergeEnvironmentConfig(config, {

package/dist/esm/core/server/helmet.mjs

@@ -1,5 +1,5 @@
-import { EOL } from "os";
 import { safeReplace } from "./utils.mjs";
+const EOL = '\n';
 const RE_HTML_ATTR = /<html[^>]*>/;
 const RE_BODY_ATTR = /<body[^>]*>/;
 const RE_LAST_IN_HEAD = /<\/head>/;

package/dist/esm/core/server/stream/beforeTemplate.worker.mjs

@@ -0,0 +1,61 @@
+import { matchRoutes } from "@modern-js/runtime-utils/router";
+import react_helmet from "react-helmet";
+import { getRouterMatchedRouteIds } from "../../../router/runtime/lifecycle.mjs";
+import { CHUNK_CSS_PLACEHOLDER } from "../constants.mjs";
+import { createReplaceHelemt } from "../helmet.mjs";
+import { buildHtml } from "../shared.mjs";
+import { safeReplace } from "../utils.mjs";
+const checkIsInline = (chunk, enableInline)=>{
+    if ('production' !== process.env.NODE_ENV) return false;
+    if (enableInline instanceof RegExp) return enableInline.test(chunk);
+    return Boolean(enableInline);
+};
+async function buildShellBeforeTemplate(beforeAppTemplate, options) {
+    const { config, runtimeContext, styledComponentsStyleTags, entryName } = options;
+    const helmetData = react_helmet.renderStatic();
+    const callbacks = [
+        createReplaceHelemt(helmetData),
+        (template)=>injectCss(template, entryName, styledComponentsStyleTags)
+    ];
+    return buildHtml(beforeAppTemplate, callbacks);
+    async function injectCss(template, entryName, styledComponentsStyleTags) {
+        let css = await getCssChunks();
+        if (styledComponentsStyleTags) css += styledComponentsStyleTags;
+        return safeReplace(template, CHUNK_CSS_PLACEHOLDER, css);
+        async function getCssChunks() {
+            const { routeManifest, routerContext, routes } = runtimeContext;
+            if (!routeManifest) return '';
+            const { routeAssets } = routeManifest;
+            let matchedRouteManifests;
+            const matchedRouteIds = getRouterMatchedRouteIds(runtimeContext);
+            if (matchedRouteIds?.length) matchedRouteManifests = matchedRouteIds.map((routeId)=>routeAssets[routeId]).filter(Boolean);
+            else {
+                if (!routerContext || !routes) return '';
+                const matches = matchRoutes(routes, routerContext.location, routerContext.basename);
+                matchedRouteManifests = matches?.map((match, index)=>{
+                    if (!index) return;
+                    const routeId = match.route.id;
+                    if (routeId) return routeAssets[routeId];
+                }).filter(Boolean);
+            }
+            const asyncEntry = routeAssets[`async-${entryName}`];
+            if (asyncEntry) matchedRouteManifests?.push(asyncEntry);
+            const cssChunks = matchedRouteManifests ? matchedRouteManifests.reduce((chunks, routeManifest)=>{
+                const { referenceCssAssets = [] } = routeManifest;
+                const _cssChunks = referenceCssAssets.filter((asset)=>asset?.endsWith('.css') && !template.includes(asset));
+                return [
+                    ...chunks,
+                    ..._cssChunks
+                ];
+            }, []) : [];
+            const { inlineStyles } = config;
+            const styles = cssChunks.map((chunk)=>{
+                const link = `<link href="${chunk}" rel="stylesheet" />`;
+                checkIsInline(chunk, inlineStyles);
+                return link;
+            });
+            return `${styles.join('')}`;
+        }
+    }
+}
+export { buildShellBeforeTemplate };

package/dist/esm/router/cli/code/tanstackTypes.mjs

@@ -78,6 +78,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)=>{
@@ -111,10 +112,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;
@@ -143,14 +151,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;
     };

package/dist/esm/router/runtime/tanstack/plugin.mjs

@@ -8,6 +8,7 @@ import { onAfterCreateRouter, onAfterHydrateRouter, onBeforeCreateRouter, onBefo
 import { applyRouterRuntimeState } from "../lifecycle.mjs";
 import { createRouteObjectsFromConfig, urlJoin } from "../utils.mjs";
 import { createModernBasepathRewrite } from "./basepathRewrite.mjs";
+import { Link } from "./prefetchLink.mjs";
 import { createRouteTreeFromRouteObjects } from "./routeTree.mjs";
 import { getTanstackRscSerializationAdapters } from "./rsc/client.mjs";
 import * as __rspack_external_react from "react";
@@ -70,6 +71,7 @@ const tanstackRouterPlugin = (userConfig = {})=>({
                     }
                 }
                 context.router = {
+                    Link: Link,
                     useMatches: useMatches,
                     useLocation: useLocation,
                     useNavigate: useNavigate,

package/dist/esm/router/runtime/tanstack/routeTree.mjs

@@ -1,4 +1,5 @@
 import { createRootRoute, createRoute, notFound, redirect } from "@tanstack/react-router";
+import { createElement } from "react";
 import { DefaultNotFound } from "../DefaultNotFound.mjs";
 function createTanstackRoute(options) {
     return createRoute(options);
@@ -43,6 +44,33 @@ function isModernDeferredData(value) {
 function normalizeModernLoaderResult(result) {
     return isModernDeferredData(result) ? result.data : 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 throwTanstackRedirect(location) {
     const target = location || '/';
     try {
@@ -209,10 +237,18 @@ function wrapRouteObjectLoader(route, revalidationState) {
 }
 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;
@@ -292,7 +328,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;
@@ -338,7 +374,7 @@ function createRouteFromModernRoute(opts) {
 }
 function createRouteTreeFromModernRoutes(routes) {
     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/rsc/server.worker.mjs

@@ -0,0 +1 @@
+export * from "@modern-js/render/rsc-worker";

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

@@ -86,13 +86,14 @@ const ssrBuilderPlugin = (modernAPI, outputModule, exportLoadablePath)=>({
                 const hasServerRendering = hasServerRenderingConfig(userConfig);
                 const hasModuleFederationRuntimeMarker = hasServerRendering && shouldUseModuleFederationNodeOutput(config);
                 const hasExplicitMfSsrFlag = isModuleFederationAppSSREnabled(userConfig);
+                const isCloudflareWorkerSSR = 'workerSSR' === name && userConfig.deploy?.target === 'cloudflare';
                 const requireExplicitMfSsrFlag = 'true' === process.env.MODERN_MF_APP_SSR_REQUIRE_EXPLICIT;
                 if (hasServerRendering && hasModuleFederationRuntimeMarker && !hasExplicitMfSsrFlag) {
                     const warningMessage = '[modernjs][mf-ssr] Module Federation SSR was auto-detected from runtime markers. Set server.ssr.moduleFederationAppSSR=true explicitly in host and remotes to avoid heuristic drift.';
                     if (requireExplicitMfSsrFlag) throw new Error(`${warningMessage} (enforced by MODERN_MF_APP_SSR_REQUIRE_EXPLICIT=true)`);
                     console.warn(warningMessage);
                 }
-                const isModuleFederationAppSSR = hasServerRendering && hasExplicitMfSsrFlag;
+                const isModuleFederationAppSSR = hasServerRendering && hasExplicitMfSsrFlag && !isCloudflareWorkerSSR;
                 const useModuleFederationNodeOutput = hasServerRendering && isModuleFederationAppSSR && isNodeEnvironmentTarget(config.output.target);
                 const ssrEnv = userConfig.deploy?.worker?.ssr || userConfig.server?.rsc ? 'edge' : 'node';
                 const appContext = modernAPI.getAppContext();
@@ -109,7 +110,7 @@ const ssrBuilderPlugin = (modernAPI, outputModule, exportLoadablePath)=>({
                 } : void 0;
                 const useLoadablePlugin = isUseSSRBundle(userConfig) && !isServerEnvironment && checkUseStringSSR(userConfig, appDirectory, entrypoints);
                 const outputConfig = {
-                    module: isServerEnvironment && !useModuleFederationNodeOutput && outputModule
+                    module: isServerEnvironment && !useModuleFederationNodeOutput && (outputModule || 'workerSSR' === name && userConfig.deploy?.target === 'cloudflare')
                 };
                 const useLoadableComponents = isUseSSRBundle(userConfig) && checkUseStringSSR(userConfig, appDirectory, entrypoints);
                 return mergeEnvironmentConfig(config, {

package/dist/esm-node/core/server/helmet.mjs

@@ -1,6 +1,6 @@
 import "node:module";
-import { EOL } from "os";
 import { safeReplace } from "./utils.mjs";
+const EOL = '\n';
 const RE_HTML_ATTR = /<html[^>]*>/;
 const RE_BODY_ATTR = /<body[^>]*>/;
 const RE_LAST_IN_HEAD = /<\/head>/;

package/dist/esm-node/core/server/stream/beforeTemplate.worker.mjs

@@ -0,0 +1,62 @@
+import "node:module";
+import { matchRoutes } from "@modern-js/runtime-utils/router";
+import react_helmet from "react-helmet";
+import { getRouterMatchedRouteIds } from "../../../router/runtime/lifecycle.mjs";
+import { CHUNK_CSS_PLACEHOLDER } from "../constants.mjs";
+import { createReplaceHelemt } from "../helmet.mjs";
+import { buildHtml } from "../shared.mjs";
+import { safeReplace } from "../utils.mjs";
+const checkIsInline = (chunk, enableInline)=>{
+    if ('production' !== process.env.NODE_ENV) return false;
+    if (enableInline instanceof RegExp) return enableInline.test(chunk);
+    return Boolean(enableInline);
+};
+async function buildShellBeforeTemplate(beforeAppTemplate, options) {
+    const { config, runtimeContext, styledComponentsStyleTags, entryName } = options;
+    const helmetData = react_helmet.renderStatic();
+    const callbacks = [
+        createReplaceHelemt(helmetData),
+        (template)=>injectCss(template, entryName, styledComponentsStyleTags)
+    ];
+    return buildHtml(beforeAppTemplate, callbacks);
+    async function injectCss(template, entryName, styledComponentsStyleTags) {
+        let css = await getCssChunks();
+        if (styledComponentsStyleTags) css += styledComponentsStyleTags;
+        return safeReplace(template, CHUNK_CSS_PLACEHOLDER, css);
+        async function getCssChunks() {
+            const { routeManifest, routerContext, routes } = runtimeContext;
+            if (!routeManifest) return '';
+            const { routeAssets } = routeManifest;
+            let matchedRouteManifests;
+            const matchedRouteIds = getRouterMatchedRouteIds(runtimeContext);
+            if (matchedRouteIds?.length) matchedRouteManifests = matchedRouteIds.map((routeId)=>routeAssets[routeId]).filter(Boolean);
+            else {
+                if (!routerContext || !routes) return '';
+                const matches = matchRoutes(routes, routerContext.location, routerContext.basename);
+                matchedRouteManifests = matches?.map((match, index)=>{
+                    if (!index) return;
+                    const routeId = match.route.id;
+                    if (routeId) return routeAssets[routeId];
+                }).filter(Boolean);
+            }
+            const asyncEntry = routeAssets[`async-${entryName}`];
+            if (asyncEntry) matchedRouteManifests?.push(asyncEntry);
+            const cssChunks = matchedRouteManifests ? matchedRouteManifests.reduce((chunks, routeManifest)=>{
+                const { referenceCssAssets = [] } = routeManifest;
+                const _cssChunks = referenceCssAssets.filter((asset)=>asset?.endsWith('.css') && !template.includes(asset));
+                return [
+                    ...chunks,
+                    ..._cssChunks
+                ];
+            }, []) : [];
+            const { inlineStyles } = config;
+            const styles = cssChunks.map((chunk)=>{
+                const link = `<link href="${chunk}" rel="stylesheet" />`;
+                checkIsInline(chunk, inlineStyles);
+                return link;
+            });
+            return `${styles.join('')}`;
+        }
+    }
+}
+export { buildShellBeforeTemplate };

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

@@ -79,6 +79,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)=>{
@@ -112,10 +113,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;
@@ -144,14 +152,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;
     };

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

@@ -9,6 +9,7 @@ import { onAfterCreateRouter, onAfterHydrateRouter, onBeforeCreateRouter, onBefo
 import { applyRouterRuntimeState } from "../lifecycle.mjs";
 import { createRouteObjectsFromConfig, urlJoin } from "../utils.mjs";
 import { createModernBasepathRewrite } from "./basepathRewrite.mjs";
+import { Link } from "./prefetchLink.mjs";
 import { createRouteTreeFromRouteObjects } from "./routeTree.mjs";
 import { getTanstackRscSerializationAdapters } from "./rsc/client.mjs";
 import * as __rspack_external_react from "react";
@@ -71,6 +72,7 @@ const tanstackRouterPlugin = (userConfig = {})=>({
                     }
                 }
                 context.router = {
+                    Link: Link,
                     useMatches: useMatches,
                     useLocation: useLocation,
                     useNavigate: useNavigate,

package/dist/esm-node/router/runtime/tanstack/routeTree.mjs

@@ -1,5 +1,6 @@
 import "node:module";
 import { createRootRoute, createRoute, notFound, redirect } from "@tanstack/react-router";
+import { createElement } from "react";
 import { DefaultNotFound } from "../DefaultNotFound.mjs";
 function createTanstackRoute(options) {
     return createRoute(options);
@@ -44,6 +45,33 @@ function isModernDeferredData(value) {
 function normalizeModernLoaderResult(result) {
     return isModernDeferredData(result) ? result.data : 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 throwTanstackRedirect(location) {
     const target = location || '/';
     try {
@@ -210,10 +238,18 @@ function wrapRouteObjectLoader(route, revalidationState) {
 }
 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;
@@ -293,7 +329,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;
@@ -339,7 +375,7 @@ function createRouteFromModernRoute(opts) {
 }
 function createRouteTreeFromModernRoutes(routes) {
     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/rsc/server.worker.mjs

@@ -0,0 +1,2 @@
+import "node:module";
+export * from "@modern-js/render/rsc-worker";

package/dist/types/core/server/stream/beforeTemplate.worker.d.ts

@@ -0,0 +1,9 @@
+import type { TInternalRuntimeContext } from '../../context';
+import type { HandleRequestConfig } from '../requestHandler';
+export interface BuildShellBeforeTemplateOptions {
+    runtimeContext: TInternalRuntimeContext;
+    entryName: string;
+    config: HandleRequestConfig;
+    styledComponentsStyleTags?: string;
+}
+export declare function buildShellBeforeTemplate(beforeAppTemplate: string, options: BuildShellBeforeTemplateOptions): Promise<string>;

package/dist/types/rsc/server.worker.d.ts

@@ -0,0 +1 @@
+export * from '@modern-js/render/rsc-worker';

package/package.json

@@ -17,7 +17,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "3.2.0-ultramodern.17",
+  "version": "3.2.0-ultramodern.22",
   "engines": {
     "node": ">=20"
   },
@@ -212,11 +212,11 @@
   "dependencies": {
     "@loadable/component": "5.16.7",
     "@loadable/server": "5.16.7",
-    "@swc/core": "1.15.33",
+    "@swc/core": "1.15.40",
     "@swc/helpers": "^0.5.21",
-    "@swc/plugin-loadable-components": "^11.9.0",
-    "@tanstack/react-router": "1.170.1",
-    "@tanstack/router-core": "1.170.1",
+    "@swc/plugin-loadable-components": "^11.10.0",
+    "@tanstack/react-router": "1.170.8",
+    "@tanstack/router-core": "1.171.6",
     "@types/loadable__component": "^5.13.10",
     "@types/react-helmet": "^6.1.11",
     "cookie": "1.1.1",
@@ -227,12 +227,12 @@
     "isbot": "5.1.40",
     "react-helmet": "^6.1.0",
     "react-is": "^19.2.6",
-    "@modern-js/plugin": "npm:@bleedingdev/modern-js-plugin@3.2.0-ultramodern.17",
-    "@modern-js/render": "npm:@bleedingdev/modern-js-render@3.2.0-ultramodern.17",
-    "@modern-js/plugin-data-loader": "npm:@bleedingdev/modern-js-plugin-data-loader@3.2.0-ultramodern.17",
-    "@modern-js/runtime-utils": "npm:@bleedingdev/modern-js-runtime-utils@3.2.0-ultramodern.17",
-    "@modern-js/types": "npm:@bleedingdev/modern-js-types@3.2.0-ultramodern.17",
-    "@modern-js/utils": "npm:@bleedingdev/modern-js-utils@3.2.0-ultramodern.17"
+    "@modern-js/plugin-data-loader": "npm:@bleedingdev/modern-js-plugin-data-loader@3.2.0-ultramodern.22",
+    "@modern-js/plugin": "npm:@bleedingdev/modern-js-plugin@3.2.0-ultramodern.22",
+    "@modern-js/render": "npm:@bleedingdev/modern-js-render@3.2.0-ultramodern.22",
+    "@modern-js/runtime-utils": "npm:@bleedingdev/modern-js-runtime-utils@3.2.0-ultramodern.22",
+    "@modern-js/types": "npm:@bleedingdev/modern-js-types@3.2.0-ultramodern.22",
+    "@modern-js/utils": "npm:@bleedingdev/modern-js-utils@3.2.0-ultramodern.22"
   },
   "peerDependencies": {
     "react": "^19.2.6",
@@ -240,18 +240,18 @@
   },
   "devDependencies": {
     "@remix-run/web-fetch": "^4.4.2",
-    "@rsbuild/core": "2.0.6",
+    "@rsbuild/core": "2.0.7",
     "@rslib/core": "0.21.5",
     "@tanstack/history": "1.162.0",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.2",
     "@types/invariant": "^2.2.37",
     "@types/loadable__server": "5.12.11",
-    "@types/node": "^25.8.0",
-    "@typescript/native-preview": "7.0.0-dev.20260516.1",
+    "@types/node": "^25.9.1",
+    "@typescript/native-preview": "7.0.0-dev.20260526.1",
     "react": "^19.2.6",
     "react-dom": "^19.2.6",
-    "@modern-js/app-tools": "npm:@bleedingdev/modern-js-app-tools@3.2.0-ultramodern.17",
+    "@modern-js/app-tools": "npm:@bleedingdev/modern-js-app-tools@3.2.0-ultramodern.22",
     "@scripts/rstest-config": "2.66.0"
   },
   "sideEffects": false,