Modernjs to enhanced

bi-directional/app1/modern.config.js

@@ -1,28 +1,26 @@
 import appTools, { defineConfig } from '@modern-js/app-tools';
-
+import { ModuleFederationPlugin } from '@module-federation/enhanced/webpack';
 // https://modernjs.dev/en/configure/app/usage
 export default defineConfig({
   server: {
     port: 3001,
   },
-  // dev: {
-  //   // set publicPath
-  //   assetPrefix: 'http://localhost:3001/',
-  // },
   runtime: {
     router: true,
   },
   source: {
-    // automatically generated asynchronous boundary via Dynamic Import, allowing the page code to consume remote modules generated by the module federation.
-    enableAsyncEntry: true,
+    enableAsyncEntry: true, // Enable async entry for module federation
   },
   tools: {
     webpack: (config, { webpack, appendPlugins }) => {
+      // Remove splitChunks optimization
       delete config.optimization.splitChunks;
       config.output.publicPath = 'auto';
+      config.output.uniqueName = 'app1';
 
+      // Add Module Federation Plugin
       appendPlugins([
-        new webpack.container.ModuleFederationPlugin({
+        new ModuleFederationPlugin({
           name: 'app1',
           runtime: false,
           filename: 'static/js/remoteEntry.js',

bi-directional/app1/package.json

@@ -27,19 +27,20 @@
     "dist/"
   ],
   "dependencies": {
-    "@modern-js/runtime": "2.50.0",
+    "@modern-js/runtime": "2.51.0",
     "react": "~18.2.0",
     "react-dom": "~18.2.0"
   },
   "devDependencies": {
-    "@modern-js/app-tools": "2.50.0",
-    "@modern-js/eslint-config": "2.50.0",
-    "@modern-js/tsconfig": "2.50.0",
-    "@modern-js-app/eslint-config": "2.50.0",
+    "@modern-js/app-tools": "2.51.0",
+    "@modern-js/eslint-config": "2.51.0",
+    "@modern-js/tsconfig": "2.51.0",
+    "@modern-js-app/eslint-config": "2.51.0",
+    "@module-federation/enhanced": "0.1.16",
     "@modern-js/builder-rspack-provider": "2.46.1",
     "lint-staged": "15.0.2",
     "prettier": "3.0.3",
     "husky": "8.0.3",
     "rimraf": "5.0.5"
   }
-}
+}

bi-directional/app1/src/routes/page.jsx

@@ -24,9 +24,7 @@ const Index = () => (
       <p className="description">
         FEDERATED: <Button />
       </p>
-      <p className="description">
-        go to http://localhost:3002
-      </p>
+      <p className="description">go to http://localhost:3002</p>
 
       <div className="grid">
         <a

bi-directional/app2/modern.config.js

@@ -1,4 +1,5 @@
 import appTools, { defineConfig } from '@modern-js/app-tools';
+import { ModuleFederationPlugin } from '@module-federation/enhanced/webpack';
 
 // https://modernjs.dev/en/configure/app/usage
 export default defineConfig({
@@ -20,14 +21,15 @@ export default defineConfig({
     webpack: (config, { webpack, appendPlugins }) => {
       delete config.optimization.splitChunks;
       config.output.publicPath = 'auto';
+      config.output.uniqueName = 'app2';
 
       appendPlugins([
-        new webpack.container.ModuleFederationPlugin({
+        new ModuleFederationPlugin({
           name: 'app2',
           runtime: false,
           filename: 'static/js/remoteEntry.js',
           remotes: {
-            app1: 'app1@http://localhost:3001/static/js/remoteEntry.js',
+            app1: 'app1@http://localhost:3001/static/js/app1_partial.js',
           },
           exposes: {
             './Button': './src/components/button.js',

bi-directional/app2/package.json

@@ -27,19 +27,20 @@
     "dist/"
   ],
   "dependencies": {
-    "@modern-js/runtime": "2.50.0",
+    "@modern-js/runtime": "2.51.0",
     "react": "~18.2.0",
     "react-dom": "~18.2.0"
   },
   "devDependencies": {
-    "@modern-js/app-tools": "2.50.0",
-    "@modern-js/eslint-config": "2.50.0",
-    "@modern-js/tsconfig": "2.50.0",
-    "@modern-js-app/eslint-config": "2.50.0",
+    "@modern-js/app-tools": "2.51.0",
+    "@modern-js/eslint-config": "2.51.0",
+    "@modern-js/tsconfig": "2.51.0",
+    "@modern-js-app/eslint-config": "2.51.0",
     "@modern-js/builder-rspack-provider": "2.46.1",
+    "@module-federation/enhanced": "0.1.16",
     "lint-staged": "15.0.2",
     "prettier": "3.0.3",
     "husky": "8.0.3",
     "rimraf": "5.0.5"
   }
-}
+}