@module-federation/modern-js 0.0.0-next-20240819040425 → 0.0.0-next-20240820034939

package/dist/esm-node/cli/server/dataLoaderPlugin.js

@@ -0,0 +1,63 @@
+import { getInstance, init } from "@module-federation/enhanced/runtime";
+import { MF_SLIM_ROUTES } from "../../runtime/constant";
+async function getSlimRemotes(mfInstance) {
+  return await Promise.all(mfInstance.options.remotes.map(async (remote) => {
+    const { routes, baseName } = await mfInstance.loadRemote(`${remote.name}/${MF_SLIM_ROUTES}`);
+    return {
+      routes,
+      baseName
+    };
+  }));
+}
+var dataLoaderPlugin_default = (mfRuntimeOptions) => ({
+  name: "MFDataLoaderServerPlugin",
+  pre: [
+    "@modern-js/plugin-inject-resource"
+  ],
+  setup(api) {
+    const { remotes, name } = mfRuntimeOptions;
+    if (!remotes.length) {
+      return {};
+    }
+    let isHandled = false;
+    return {
+      prepare() {
+        const { middlewares } = api.useAppContext();
+        middlewares.push({
+          name: "MFDataLoaderServerPlugin",
+          handler: async (c, next) => {
+            console.log("isHandled : ", isHandled);
+            const serverManifest = c.get("serverManifest");
+            const { loaderBundles, nestedRoutesJson } = serverManifest;
+            console.log("nestedRoutesJson: ", nestedRoutesJson);
+            console.log("loaderBundles.main.routes : ", loaderBundles.main.routes);
+            if (isHandled) {
+              await next();
+            } else {
+              const instance = getInstance() || init({
+                name,
+                remotes
+              });
+              const slimRoutes = await getSlimRemotes(instance);
+              slimRoutes.forEach((slimRoute) => {
+                const { routes, baseName } = slimRoute;
+                routes[0].path = `/${baseName}`;
+                loaderBundles.main.routes.push(...routes);
+                nestedRoutesJson.default.main.push(...routes);
+              });
+              console.log("push loaderBundles.main.routes done ");
+              isHandled = true;
+              await next();
+            }
+          },
+          before: [
+            "render"
+          ]
+        });
+      }
+    };
+  }
+});
+export {
+  dataLoaderPlugin_default as default
+};

package/dist/esm-node/cli/ssrPlugin.js

@@ -1,8 +1,8 @@
 import path from "path";
 import { fs } from "@modern-js/utils";
-import { ModuleFederationPlugin } from "@module-federation/enhanced/webpack";
+import { ModuleFederationPlugin } from "@module-federation/enhanced";
 import { ModuleFederationPlugin as RspackModuleFederationPlugin } from "@module-federation/enhanced/rspack";
-import UniverseEntryChunkTrackerPlugin from "@module-federation/node/universe-entry-chunk-tracker-plugin";
+import { UniverseEntryChunkTrackerPlugin } from "@module-federation/node";
 import { updateStatsAndManifest } from "./manifest";
 import { isDev } from "./constant";
 function setEnv() {

package/dist/esm-node/cli/utils.js

@@ -47,7 +47,9 @@ const replaceRemoteUrl = (mfConfig, remoteIpStrategy) => {
       if (typeof remoteObject === "string") {
         return;
       }
-      handleRemoteObject(remoteObject);
+      if ("entry" in remoteObject && typeof remoteObject.entry === "string") {
+        remoteObject.entry = remoteObject.entry.replace(LOCALHOST, ipv4);
+      }
     });
   } else if (typeof mfConfig.remotes !== "string") {
     handleRemoteObject(mfConfig.remotes);
@@ -291,5 +293,6 @@ export {
   getMFConfig,
   patchBundlerConfig,
   patchIgnoreWarning,
-  patchMFConfig
+  patchMFConfig,
+  replaceRemoteUrl
 };

package/dist/esm-node/runtime/constant.js

@@ -0,0 +1,8 @@
+const MF_SLIM_ROUTES = "mf-slim-routes";
+const MF_FULL_ROUTES = "mf-full-routes";
+const MF_ROUTES_META = "mf-routes-meta";
+export {
+  MF_FULL_ROUTES,
+  MF_ROUTES_META,
+  MF_SLIM_ROUTES
+};

package/dist/esm-node/runtime/dataLoader.js

@@ -0,0 +1,63 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getInstance, loadRemote } from "@module-federation/enhanced/runtime";
+import { MF_FULL_ROUTES } from "./constant";
+globalThis.mfRemoteRoutes = globalThis.mfRemoteRoutes || [];
+var _globalThis_mfHasLoadedRemoteRoutes;
+globalThis.mfHasLoadedRemoteRoutes = (_globalThis_mfHasLoadedRemoteRoutes = globalThis.mfHasLoadedRemoteRoutes) !== null && _globalThis_mfHasLoadedRemoteRoutes !== void 0 ? _globalThis_mfHasLoadedRemoteRoutes : false;
+async function loadRoutes() {
+  var _getInstance;
+  if (globalThis.mfHasLoadedRemoteRoutes) {
+    return;
+  }
+  const remotes = (_getInstance = getInstance()) === null || _getInstance === void 0 ? void 0 : _getInstance.options.remotes;
+  if (!remotes) {
+    return;
+  }
+  const remoteModuleIds = remotes.map((remote) => {
+    return `${remote.name}/${MF_FULL_ROUTES}`;
+  });
+  const traverse = (cRoutes, prefix) => {
+    cRoutes.forEach((i) => {
+      i.id = prefix + i.id;
+      const Comp = i.component;
+      i.element = /* @__PURE__ */ _jsx(Comp, {});
+      if (i.children) {
+        traverse(i.children, prefix);
+      }
+    });
+  };
+  await Promise.all(remoteModuleIds.map(async (remoteModuleId) => {
+    const remoteName = remoteModuleId.split(`/${MF_FULL_ROUTES}`)[0];
+    const { routes, baseName } = await loadRemote(remoteModuleId);
+    routes[0].path = `/${baseName}`;
+    routes[0].isRoot = false;
+    globalThis.mfRemoteRoutes.push(...routes);
+  }));
+  globalThis.mfHasLoadedRemoteRoutes = true;
+  return globalThis.mfRemoteRoutes;
+}
+const ssrDataLoaderPlugin = () => {
+  return {
+    name: "@modern-js/plugin-mf-data-loader",
+    post: [
+      "@modern-js/plugin-router"
+    ],
+    setup: () => {
+      return {
+        async beforeRender({ context }) {
+          console.log("init");
+          await loadRoutes();
+        },
+        modifyRoutes: (routes) => {
+          console.log("modifyRoutes");
+          routes.push(...globalThis.mfRemoteRoutes);
+          console.log("routes: ", routes);
+          return routes;
+        }
+      };
+    }
+  };
+};
+export {
+  ssrDataLoaderPlugin
+};

package/dist/esm-node/runtime/index.js

@@ -1,5 +1,7 @@
 export * from "@module-federation/enhanced/runtime";
 import { createRemoteSSRComponent } from "./createRemoteSSRComponent";
+import { withMFRouteId } from "./withMFRouteId";
 export {
-  createRemoteSSRComponent
+  createRemoteSSRComponent,
+  withMFRouteId
 };

package/dist/esm-node/runtime/utils.js

@@ -0,0 +1,19 @@
+function transformName2Prefix(name) {
+  const NameTransformSymbol = {
+    AT: "@",
+    HYPHEN: "-",
+    SLASH: "/",
+    UNDERLINE: "_"
+  };
+  const NameTransformMap = {
+    [NameTransformSymbol.AT]: "SCOPE",
+    [NameTransformSymbol.HYPHEN]: "HYPHEN",
+    [NameTransformSymbol.SLASH]: "SLASH",
+    [NameTransformSymbol.UNDERLINE]: "UNDERLINE"
+  };
+  const SPLIT_SYMBOL = "@";
+  return `${name.replace(new RegExp(`${NameTransformSymbol.AT}`, "g"), NameTransformMap[NameTransformSymbol.AT]).replace(new RegExp(`${NameTransformSymbol.HYPHEN}`, "g"), NameTransformMap[NameTransformSymbol.HYPHEN]).replace(new RegExp(`${NameTransformSymbol.SLASH}`, "g"), NameTransformMap[NameTransformSymbol.SLASH]).replace(new RegExp(`${NameTransformSymbol.UNDERLINE}`, "g"), NameTransformMap[NameTransformSymbol.UNDERLINE])}${SPLIT_SYMBOL}`;
+}
+export {
+  transformName2Prefix
+};

package/dist/esm-node/runtime/withMFRouteId.js

@@ -0,0 +1,7 @@
+function withMFRouteId(id) {
+  const prefix = typeof MODERN_ROUTER_ID_PREFIX === "string" ? MODERN_ROUTER_ID_PREFIX : "";
+  return prefix + id;
+}
+export {
+  withMFRouteId
+};

package/dist/esm-node/ssr-runtime/plugin.js

@@ -1,15 +1,18 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import hoistNonReactStatics from "hoist-non-react-statics";
 import { SSRLiveReload } from "./SSRLiveReload";
+console.log("mfSSRPlugin trigger");
 const mfSSRPlugin = () => ({
   name: "@module-federation/modern-js",
+  pre: [
+    "@modern-js/plugin-router"
+  ],
   setup: () => {
     return {
-      async init({ context }, next) {
+      async beforeRender() {
+        console.log(111, "beforeRender");
         if (typeof window !== "undefined") {
-          return next({
-            context
-          });
+          return;
         }
         globalThis.shouldUpdate = false;
         const nodeUtils = await import("@module-federation/node/utils");
@@ -19,9 +22,7 @@ const mfSSRPlugin = () => ({
           await nodeUtils.flushChunks();
           globalThis.shouldUpdate = true;
         }
-        return next({
-          context
-        });
+        return;
       },
       wrapRoot(App) {
         const AppWrapper = (props) => /* @__PURE__ */ _jsxs(_Fragment, {

package/dist/types/cli/ast/constant.d.ts

@@ -0,0 +1,8 @@
+export declare const IS_ROOT = "isRoot";
+export declare const ID = "id";
+export declare const COMPONENT = "component";
+export declare const LAZY_COMPONENT = "lazyImport";
+export declare const SHOULD_REVALIDATE = "shouldRevalidate";
+export declare const PRIVATE_COMPONENT = "_component";
+export declare const ELEMENT = "element";
+export declare const LOADER = "loader";

package/dist/types/cli/ast/generateRoutes.d.ts

@@ -0,0 +1,7 @@
+declare function generateRoutes({ sourceCode, filePath, prefix, baseName, }: {
+    sourceCode: string;
+    filePath: string;
+    prefix: string;
+    baseName: string;
+}): void;
+export { generateRoutes };

package/dist/types/cli/ast/generateSerializableRoutes.d.ts

@@ -0,0 +1,5 @@
+declare function generateSerializableRoutes({ sourceCode, prefix, }: {
+    sourceCode: string;
+    prefix: string;
+}): string;
+export { generateSerializableRoutes };

package/dist/types/cli/ast/generateSlimRoutes.d.ts

@@ -0,0 +1,7 @@
+declare function generateSlimRoutes({ sourceCode, filePath, prefix, baseName, }: {
+    sourceCode: string;
+    filePath: string;
+    prefix: string;
+    baseName: string;
+}): void;
+export { generateSlimRoutes };

package/dist/types/cli/ast/index.d.ts

@@ -0,0 +1,3 @@
+export { generateRoutes } from './generateRoutes';
+export { generateSlimRoutes } from './generateSlimRoutes';
+export { generateSerializableRoutes } from './generateSerializableRoutes';

package/dist/types/cli/bundler-plugins/SerializableRoutesPlugin.d.ts

@@ -0,0 +1,12 @@
+import { webpack } from '@modern-js/app-tools';
+export declare const SERIALIZABLE_ROUTES = "serializable-routes.json";
+declare class SerializableRoutesPlugin implements webpack.WebpackPluginInstance {
+    routesFilePath: string;
+    prefix: string;
+    constructor(options: {
+        routesFilePath: string;
+        prefix: string;
+    });
+    apply(compiler: webpack.Compiler): void;
+}
+export { SerializableRoutesPlugin };

package/dist/types/cli/constant.d.ts

@@ -1 +1,3 @@
 export declare const isDev: boolean;
+export declare const MODERN_JS_FILE_SYSTEM_ROUTES_FILE_NAME = "routes.js";
+export declare const META_NAME = "modern-js";

package/dist/types/cli/dataLoaderPlugin.d.ts

@@ -0,0 +1,6 @@
+import type { CliPlugin, AppTools } from '@modern-js/app-tools';
+import type { DataLoaderOptions, InternalModernPluginOptions } from '../types';
+import { generateRoutes, generateSlimRoutes } from './ast';
+export declare const moduleFederationDataLoaderPlugin: (enable: boolean, internalOptions: InternalModernPluginOptions, userConfig: DataLoaderOptions) => CliPlugin<AppTools>;
+export default moduleFederationDataLoaderPlugin;
+export { generateRoutes, generateSlimRoutes };

package/dist/types/cli/server/dataLoaderPlugin.d.ts

@@ -0,0 +1,5 @@
+import type { ServerPlugin } from '@modern-js/server-core';
+import { init } from '@module-federation/enhanced/runtime';
+type MFRuntimeOptions = Parameters<typeof init>[0];
+declare const _default: (mfRuntimeOptions: MFRuntimeOptions) => ServerPlugin;
+export default _default;

package/dist/types/cli/utils.d.ts

@@ -2,8 +2,10 @@ import type { webpack, UserConfig, AppTools, Rspack, Bundler } from '@modern-js/
 import { moduleFederationPlugin } from '@module-federation/sdk';
 import { PluginOptions } from '../types';
 import { BundlerConfig } from '../interfaces/bundler';
+import type { init } from '@module-federation/enhanced/runtime';
 export type ConfigType<T> = T extends 'webpack' ? webpack.Configuration : T extends 'rspack' ? Rspack.Configuration : never;
 export declare const getMFConfig: (userConfig: PluginOptions) => Promise<moduleFederationPlugin.ModuleFederationPluginOptions>;
+export declare const replaceRemoteUrl: (mfConfig: moduleFederationPlugin.ModuleFederationPluginOptions | Parameters<typeof init>[0], remoteIpStrategy?: "ipv4" | "inherit") => void;
 export declare const patchMFConfig: (mfConfig: moduleFederationPlugin.ModuleFederationPluginOptions, isServer: boolean, remoteIpStrategy?: "ipv4" | "inherit") => moduleFederationPlugin.ModuleFederationPluginOptions;
 export declare function patchIgnoreWarning<T extends Bundler>(bundlerConfig: BundlerConfig<T>): void;
 export declare function patchBundlerConfig<T extends Bundler>(options: {

package/dist/types/interfaces/route.d.ts

@@ -0,0 +1,13 @@
+export type Route = {
+    id: string;
+    type: string;
+    loader?: boolean;
+    index?: boolean;
+    isRoot?: boolean;
+    children?: Route[];
+};
+export type MFModernRouteJson = {
+    baseName: string;
+    routes: Record<string, Route[]>;
+    prefix: string;
+};

package/dist/types/runtime/constant.d.ts

@@ -0,0 +1,3 @@
+export declare const MF_SLIM_ROUTES = "mf-slim-routes";
+export declare const MF_FULL_ROUTES = "mf-full-routes";
+export declare const MF_ROUTES_META = "mf-routes-meta";

package/dist/types/runtime/dataLoader.d.ts

@@ -0,0 +1,7 @@
+import type { Plugin } from '@modern-js/runtime';
+import { type RouteObject } from '@modern-js/runtime/router';
+declare global {
+    var mfRemoteRoutes: RouteObject[];
+    var mfHasLoadedRemoteRoutes: boolean;
+}
+export declare const ssrDataLoaderPlugin: () => Plugin;

package/dist/types/runtime/index.d.ts

@@ -1,2 +1,3 @@
 export * from '@module-federation/enhanced/runtime';
 export { createRemoteSSRComponent } from './createRemoteSSRComponent';
+export { withMFRouteId } from './withMFRouteId';

package/dist/types/runtime/utils.d.ts

@@ -0,0 +1 @@
+export declare function transformName2Prefix(name: string): string;

package/dist/types/runtime/withMFRouteId.d.ts

@@ -0,0 +1 @@
+export declare function withMFRouteId(id: string): string;

package/dist/types/types/index.d.ts

@@ -1,10 +1,12 @@
 import { moduleFederationPlugin } from '@module-federation/sdk';
 import type { ModuleFederationPlugin as WebpackModuleFederationPlugin } from '@module-federation/enhanced';
 import type { ModuleFederationPlugin as RspackModuleFederationPlugin } from '@module-federation/enhanced/rspack';
+import type { init } from '@module-federation/enhanced/runtime';
 export interface PluginOptions {
     config?: moduleFederationPlugin.ModuleFederationPluginOptions;
     configPath?: string;
     remoteIpStrategy?: 'ipv4' | 'inherit';
+    dataLoader?: false | Pick<DataLoaderOptions, 'baseName' | 'partialSSRRemotes'>;
 }
 export interface InternalModernPluginOptions {
     csrConfig?: moduleFederationPlugin.ModuleFederationPluginOptions;
@@ -16,3 +18,12 @@ export interface InternalModernPluginOptions {
     remoteIpStrategy?: 'ipv4' | 'inherit';
 }
 export type BundlerPlugin = WebpackModuleFederationPlugin | RspackModuleFederationPlugin;
+export type TransformRuntimeOptions = (mfConfig: moduleFederationPlugin.ModuleFederationPluginOptions) => Parameters<typeof init>[0];
+export type DataLoaderOptions = {
+    baseName: string;
+    partialSSRRemotes?: string[];
+    metaName?: string;
+    serverPlugin?: string;
+    transformRuntimeOptions?: TransformRuntimeOptions;
+    fetchSSRByRouteIds?: (partialSSRRemotes: string[], mfConfig: moduleFederationPlugin.ModuleFederationPluginOptions, transformRuntimeOptions: TransformRuntimeOptions) => Promise<string[] | undefined>;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@module-federation/modern-js",
-  "version": "0.0.0-next-20240819040425",
+  "version": "0.0.0-next-20240820034939",
   "files": [
     "dist/",
     "types.d.ts",
@@ -23,6 +23,19 @@
       "types": "./dist/types/ssr-runtime/index.d.ts",
       "default": "./dist/esm/ssr-runtime/index.js"
     },
+    "./data-loader": {
+      "types": "./dist/types/runtime/dataLoader.d.ts",
+      "default": "./dist/esm/runtime/dataLoader.js"
+    },
+    "./data-loader-server": {
+      "types": "./dist/types/cli/server/dataLoaderPlugin.d.ts",
+      "default": "./dist/cjs/cli/server/dataLoaderPlugin.js"
+    },
+    "./data-loader-plugin": {
+      "import": "./dist/esm/cli/dataLoaderPlugin.js",
+      "require": "./dist/cjs/cli/dataLoaderPlugin.js",
+      "types": "./dist/types/cli/dataLoaderPlugin.d.ts"
+    },
     "./config-plugin": {
       "import": "./dist/esm/cli/configPlugin.js",
       "require": "./dist/cjs/cli/configPlugin.js",
@@ -47,6 +60,15 @@
       ],
       "ssr-plugin": [
         "./dist/types/cli/ssrPlugin.d.ts"
+      ],
+      "data-loader-plugin": [
+        "./dist/types/cli/dataLoaderPlugin.d.ts"
+      ],
+      "data-loader": [
+        "./dist/types/runtime/dataLoader.d.ts"
+      ],
+      "data-loader-server": [
+        "./dist/types/cli/server/dataLoaderPlugin.d.ts"
       ]
     }
   },
@@ -55,24 +77,31 @@
   "author": "hanric <hanric.zhang@gmail.com>",
   "license": "MIT",
   "dependencies": {
-    "@swc/helpers": "0.5.12",
+    "@swc/helpers": "0.5.3",
     "@modern-js/utils": "2.54.2",
     "@modern-js/node-bundle-require": "2.54.2",
     "node-fetch": "~3.3.0",
     "react-error-boundary": "4.0.13",
     "hoist-non-react-statics": "3.3.2",
-    "@module-federation/sdk": "0.0.0-next-20240819040425",
-    "@module-federation/enhanced": "0.0.0-next-20240819040425",
-    "@module-federation/node": "0.0.0-next-20240819040425"
+    "@babel/generator": "7.25.0",
+    "@babel/parser": "7.25.3",
+    "@babel/traverse": "7.25.3",
+    "@babel/types": "7.25.2",
+    "@module-federation/sdk": "0.0.0-next-20240820034939",
+    "@module-federation/enhanced": "0.0.0-next-20240820034939",
+    "@module-federation/node": "0.0.0-next-20240820034939"
   },
   "devDependencies": {
+    "@types/babel__traverse": "7.20.6",
+    "@types/babel__generator": "7.6.8",
     "@types/hoist-non-react-statics": "3.3.2",
-    "@modern-js/app-tools": "2.57.0",
-    "@modern-js/core": "2.57.0",
-    "@modern-js/runtime": "2.57.0",
-    "@modern-js/module-tools": "2.57.0",
-    "@modern-js/tsconfig": "2.57.0",
-    "@module-federation/manifest": "0.0.0-next-20240819040425"
+    "@modern-js/server-core": "0.0.0-next-20240816082741",
+    "@modern-js/app-tools": "0.0.0-next-20240816082741",
+    "@modern-js/core": "0.0.0-next-20240816082741",
+    "@modern-js/runtime": "0.0.0-next-20240816082741",
+    "@modern-js/module-tools": "0.0.0-next-20240816082741",
+    "@modern-js/tsconfig": "0.0.0-next-20240816082741",
+    "@module-federation/manifest": "0.0.0-next-20240820034939"
   },
   "peerDependencies": {
     "react": ">=17",