Merge branch 'main' into fix-nextjs-mf-remote-loading

Author: h3adache

.changeset/shaggy-ligers-teach.md

@@ -0,0 +1,5 @@
+---
+'@module-federation/manifest': patch
+---
+
+fix(manifest): stats should add prefetchInterface if enable dataPrefetch

.changeset/small-eyes-change.md

@@ -0,0 +1,6 @@
+---
+'@module-federation/retry-plugin': patch
+'@module-federation/runtime': patch
+---
+
+feat: add remote-entry script resource retry for retry-plugin

apps/router-demo/router-host-2000/rsbuild.config.ts

@@ -31,7 +31,7 @@ export default defineConfig({
       shared: ['react', 'react-dom', 'antd'],
       runtimePlugins: [
         path.join(__dirname, './src/runtime-plugin/shared-strategy.ts'),
-        // path.join(__dirname, './src/runtime-plugin/retry.ts'),
+        path.join(__dirname, './src/runtime-plugin/retry.ts'),
       ],
       // bridge: {
       //   disableAlias: true,

apps/router-demo/router-host-2000/src/App.tsx

@@ -14,22 +14,22 @@ init({
   remotes: [],
   plugins: [
     BridgeReactPlugin(),
-    RetryPlugin({
-      fetch: {
-        url: 'http://localhost:2008/not-exist-mf-manifest.json',
-        fallback: () => 'http://localhost:2001/mf-manifest.json',
-      },
-      script: {
-        retryTimes: 3,
-        retryDelay: 1000,
-        moduleName: ['remote1'],
-        cb: (resolve, error) => {
-          return setTimeout(() => {
-            resolve(error);
-          }, 1000);
-        },
-      },
-    }),
+    // RetryPlugin({
+    //   fetch: {
+    //     url: 'http://localhost:2008/not-exist-mf-manifest.json',
+    //     fallback: () => 'http://localhost:2001/mf-manifest.json',
+    //   },
+    //   script: {
+    //     retryTimes: 3,
+    //     retryDelay: 1000,
+    //     moduleName: ['remote1'],
+    //     cb: (resolve, error) => {
+    //       return setTimeout(() => {
+    //         resolve(error);
+    //       }, 1000);
+    //     },
+    //   },
+    // }),
   ],
 });
 

apps/website-new/docs/en/guide/basic/runtime.mdx

@@ -87,11 +87,12 @@ type ShareArgs =
   | (SharedBaseArgs & { lib: () => Module });
 
 type SharedBaseArgs = {
-  version: string;
+  version?: string;
   shareConfig?: SharedConfig;
   scope?: string | Array<string>;
   deps?: Array<string>;
   strategy?: 'version-first' | 'loaded-first';
+  loaded?: boolean;
 };
 
 type SharedGetter = (() => () => Module) | (() => Promise<() => Module>);
@@ -112,22 +113,32 @@ interface RemotesWithEntry {
 
 type ShareInfos = {
   // The name of the dependency, basic information about the dependency, and sharing strategy
-  [pkgName: string]: Share;
+  [pkgName: string]: Shared[];
 };
 
-type Share = {
+type Shared = {
   // The version of the shared dependency
   version: string;
   // Which modules are currently consuming this dependency
-  useIn?: Array<string>;
+  useIn: Array<string>;
   // From which module does the shared dependency come?
-  from?: string;
+  from: string;
   // Factory function to get the shared dependency instance. When no other existing dependencies, it will load its own shared dependencies.
-  lib: () => Module;
+  lib?: () => Module;
   // Sharing strategy, which strategy will be used to decide whether to reuse the dependency
-  shareConfig?: SharedConfig;
+  shareConfig: SharedConfig;
   // The scope where the shared dependency is located, the default value is default
-  scope?: string | Array<string>;
+  scope: Array<string>;
+  // Function to retrieve the shared dependency instance.
+  get: SharedGetter;
+  // List of dependencies that this shared module depends on
+  deps: Array<string>;
+  // Indicates whether the shared dependency has been loaded
+  loaded?: boolean;
+  // Represents the loading state of the shared dependency
+  loading?: null | Promise<any>;
+  // Determines if the shared dependency should be loaded eagerly
+  eager?: boolean;
 };
 ```
 

apps/website-new/docs/en/plugin/dev/index.mdx

@@ -534,6 +534,36 @@ const changeScriptAttributePlugin: () => FederationRuntimePlugin = function () {
 };
 ```
 
+### fetch
+The `fetch` function allows customizing the request that fetches the manifest JSON. A successful `Response` must yield a valid JSON.
+
+`AsyncHook`
+
+- **Type**
+
+```typescript
+function fetch(manifestUrl: string, requestInit: RequestInit): Promise<Response> | void | false;
+```
+
+- Example for including the credentials when fetching the manifest JSON:
+
+```typescript
+// fetch-manifest-with-credentials-plugin.ts
+import type { FederationRuntimePlugin } from '@module-federation/enhanced/runtime';
+
+export default function (): FederationRuntimePlugin {
+  return {
+    name: 'fetch-manifest-with-credentials-plugin',
+    fetch(manifestUrl, requestInit) {
+      return fetch(manifestUrl, {
+        ...requestInit,
+        credentials: 'include'
+      });
+    },
+  }
+};
+```
+
 ### loadEntry
 The `loadEntry` function allows for full customization of remotes, enabling you to extend and create new remote types. The following two simple examples demonstrate loading JSON data and module delegation.
 

package.json

@@ -97,7 +97,7 @@
   "devDependencies": {
     "@babel/core": "^7.24.7",
     "@babel/plugin-transform-react-jsx": "7.25.9",
-    "@babel/preset-react": "^7.24.7",
+    "@babel/preset-react": "^7.26.3",
     "@changesets/cli": "^2.27.9",
     "@chromatic-com/storybook": "^1.7.0",
     "@commitlint/cli": "^19.4.1",

packages/chrome-devtools/package.json

@@ -74,7 +74,7 @@
     "@modern-js/storybook": "2.60.6",
     "@modern-js/tsconfig": "2.60.6",
     "@module-federation/runtime": "workspace:*",
-    "@playwright/test": "1.48.2",
+    "@playwright/test": "1.49.1",
     "@storybook/addon-essentials": "^8",
     "@types/chrome": "^0.0.272",
     "@types/dagre": "^0.7.52",

packages/manifest/src/ManifestManager.ts

@@ -1,4 +1,3 @@
-import path from 'path';
 import fs from 'fs';
 import chalk from 'chalk';
 import {
@@ -103,20 +102,6 @@ class ManifestManager {
       return sum;
     }, [] as ManifestRemote[]);
 
-    let prefetchInterface = false;
-    const prefetchFilePath = path.resolve(
-      compiler.options.context || process.cwd(),
-      `node_modules/.mf/${encodeName(stats.name)}/${MFPrefetchCommon.fileName}`,
-    );
-    const existPrefetch = fs.existsSync(prefetchFilePath);
-    if (existPrefetch) {
-      const content = fs.readFileSync(prefetchFilePath).toString();
-      if (content) {
-        prefetchInterface = true;
-      }
-    }
-    stats.metaData.prefetchInterface = prefetchInterface;
-
     this._manifest = manifest;
 
     const manifestFileName = this.fileName;

packages/manifest/src/StatsManager.ts

@@ -1,7 +1,8 @@
 /* eslint-disable max-lines-per-function */
 /* eslint-disable @typescript-eslint/member-ordering */
 /* eslint-disable max-depth */
-
+import fs from 'fs';
+import path from 'path';
 import {
   StatsRemote,
   StatsBuildInfo,
@@ -11,6 +12,8 @@ import {
   StatsAssets,
   moduleFederationPlugin,
   RemoteEntryType,
+  encodeName,
+  MFPrefetchCommon,
 } from '@module-federation/sdk';
 import {
   Compilation,
@@ -136,6 +139,20 @@ class StatsManager {
       pluginVersion: this._pluginVersion,
     };
 
+    let prefetchInterface = false;
+    const prefetchFilePath = path.resolve(
+      compiler.options.context || process.cwd(),
+      `node_modules/.mf/${encodeName(name!)}/${MFPrefetchCommon.fileName}`,
+    );
+    const existPrefetch = fs.existsSync(prefetchFilePath);
+    if (existPrefetch) {
+      const content = fs.readFileSync(prefetchFilePath).toString();
+      if (content) {
+        prefetchInterface = true;
+      }
+    }
+    metaData.prefetchInterface = prefetchInterface;
+
     if (this._options.getPublicPath) {
       if ('publicPath' in metaData) {
         delete metaData.publicPath;