Feature/module federation 0.18.4 refactor

package.json

@@ -39,7 +39,7 @@
     "biome": "biome"
   },
   "engines": {
-    "node": ">=16.0.0",
+    "node": ">=18.0.0",
     "pnpm": ">=8"
   },
   "devDependencies": {

packages/cli/tsconfig/react.json

@@ -1,6 +1,7 @@
 {
   "extends": ["./base"],
   "compilerOptions": {
-    "types": ["@empjs/cli/types/react"]
+    "types": ["@empjs/cli/types/react"],
+    "jsx": "react-jsx"
   }
 }

packages/emp-module-federation/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@empjs/module-federation",
-  "version": "0.18.4-1",
+  "version": "0.18.4-2",
   "description": "emp module-federation",
   "license": "MIT",
   "type": "module",
@@ -67,11 +67,11 @@
     "node": ">=16.0.0"
   },
   "author": "Ken",
-  "devDependencies": {},
   "dependencies": {
-    "@module-federation/sdk": "0.18.4",
     "@module-federation/error-codes": "0.18.4",
+    "@module-federation/rspack": "0.18.4",
+    "@module-federation/runtime": "^0.18.4",
     "@module-federation/runtime-core": "0.18.4",
-    "@module-federation/rspack": "0.18.4"
+    "@module-federation/sdk": "0.18.4"
   }
 }

packages/emp-module-federation/src/runtime.ts

@@ -0,0 +1 @@
+export * from '@module-federation/runtime'

packages/emp-module-federation/tsup.config.ts

@@ -5,7 +5,7 @@ export default defineConfig(({watch}) => {
   return {
     // entry: ['src/runtime/index.ts', 'src/sdk.ts', 'src/rspack.ts'],
     entry: {
-      runtime: 'src/runtime/index.ts',
+      runtime: 'src/runtime.ts',
       sdk: 'src/sdk.ts',
       rspack: 'src/rspack.ts',
     },

packages/emp-share/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@empjs/share",
-  "version": "3.10.0",
+  "version": "3.10.0-beta.5",
   "description": "emp share and runtime",
   "license": "MIT",
   "type": "module",
@@ -37,6 +37,16 @@
         "default": "./dist/runtime.cjs"
       }
     },
+    "./mfRuntime": {
+      "import": {
+        "types": "./dist/mfRuntime.d.ts",
+        "default": "./dist/mfRuntime.js"
+      },
+      "require": {
+        "types": "./dist/mfRuntime.d.cts",
+        "default": "./dist/mfRuntime.cjs"
+      }
+    },
     "./adapter": {
       "import": {
         "types": "./dist/adapter.d.ts",
@@ -76,6 +86,7 @@
     "*": {
       ".": ["./dist/index.d.ts"],
       "runtime": ["./dist/runtime.d.ts"],
+      "mfRuntime": ["./dist/mfRuntime.d.ts"],
       "adapter": ["./dist/adapter.d.ts"],
       "adapterVue": ["./dist/adapter.d.ts"],
       "rspack": ["./dist/rspack.d.ts"],
@@ -95,8 +106,10 @@
   },
   "author": "Ken",
   "dependencies": {
-    "core-js": "^3.45.1",
-    "@empjs/module-federation": "workspace:*"
+    "@module-federation/rspack": "0.18.4",
+    "@module-federation/runtime": "^0.18.4",
+    "@module-federation/sdk": "0.18.4",
+    "core-js": "^3.45.1"
   },
   "devDependencies": {
     "@empjs/cli": "workspace:*",

packages/emp-share/src/helper/moduleFederation.ts

@@ -1,7 +1,8 @@
-import * as MFRuntime from '@empjs/module-federation/runtime'
-import * as MFSDK from '@empjs/module-federation/sdk'
+import * as MFRuntime from '@module-federation/runtime'
+import * as MFSDK from '@module-federation/sdk'
 export {MFRuntime, MFSDK}
 
 // export type FederationRuntimePlugin = MFRuntime.FederationRuntimePlugin
-import type {ModuleFederationRuntimePlugin} from '@empjs/module-federation/runtime'
+import type {ModuleFederationRuntimePlugin} from '@module-federation/runtime'
 export type FederationRuntimePlugin = ModuleFederationRuntimePlugin
+export type {ModuleFederationRuntimePlugin}

packages/emp-share/src/helper/rspack.ts

@@ -1 +1 @@
-export {ModuleFederationPlugin} from '@empjs/module-federation/rspack'
+export {ModuleFederationPlugin} from '@module-federation/rspack'

packages/emp-share/src/runtime/index-bakup.ts

@@ -0,0 +1,57 @@
+import {deepAssign} from 'src/helper'
+import {shareGlobalName} from 'src/helper/config'
+import type {EMPShareRuntimeType, EmpRuntimeOptions, InitOptionsType, LoadRemoteType} from 'src/types'
+
+type EmpInitOptionsType = Partial<InitOptionsType>
+let globalLib = window[shareGlobalName] || {}
+// 根据 injectGlobalValToHtml 提前把库赋值到 EMPRuntime
+const win: any = window
+const {EMPShareGlobalVal} = win || {}
+if (EMPShareGlobalVal && EMPShareGlobalVal.runtimeLib) {
+  globalLib = win[EMPShareGlobalVal.runtimeLib]
+}
+
+export class EMPRuntime {
+  public libs: EMPShareRuntimeType = globalLib
+  public initOptions!: InitOptionsType
+  public options: EmpRuntimeOptions = {
+    showLog: false,
+  }
+  public shareGlobalName = shareGlobalName
+  private isInit = false
+  constructor(op?: EMPShareRuntimeType) {
+    if (op) this.setup(op)
+  }
+  /**
+   * 实例化 adapter libs
+   */
+  public setup(o?: EMPShareRuntimeType | string) {
+    if (o) {
+      if (typeof o === 'string') o = window[o]
+      this.libs = o as any
+    }
+    if (!this.libs.MFRuntime || !this.libs.MFSDK) {
+      throw new Error('MFRuntime and MFSDK Required!')
+    }
+  }
+  public init(options: EmpInitOptionsType = {}) {
+    if (this.isInit) return
+    let op: InitOptionsType = {
+      name: 'empRuntimeProject',
+      remotes: [],
+      // plugins: [catchErrorNextPlugin(this.options.showLog)],
+    }
+    op = deepAssign<InitOptionsType>(op, options)
+    this.libs.MFRuntime.init(op)
+    this.isInit = true
+  }
+  public load<T = any>(...args: LoadRemoteType) {
+    return this.libs.MFRuntime.loadRemote<T>(...args) as Promise<T>
+  }
+  public register = this.libs?.MFRuntime.registerRemotes
+  public preload = this.libs?.MFRuntime.preloadRemote
+  public loadShare = this.libs?.MFRuntime.loadShare
+  public preloadRemote = this.libs?.MFRuntime.preloadRemote
+}
+//
+export default new EMPRuntime()

packages/emp-share/src/runtime/index.ts

@@ -1,3 +1,4 @@
+import type {ModuleFederation} from '@module-federation/runtime'
 import {deepAssign} from 'src/helper'
 import {shareGlobalName} from 'src/helper/config'
 import type {EMPShareRuntimeType, EmpRuntimeOptions, InitOptionsType, LoadRemoteType} from 'src/types'
@@ -18,13 +19,10 @@ export class EMPRuntime {
     showLog: false,
   }
   public shareGlobalName = shareGlobalName
-  private isInit = false
   constructor(op?: EMPShareRuntimeType) {
     if (op) this.setup(op)
   }
-  /**
-   * 实例化 adapter libs
-   */
+  public mfInstance?: ModuleFederation
   public setup(o?: EMPShareRuntimeType | string) {
     if (o) {
       if (typeof o === 'string') o = window[o]
@@ -35,23 +33,30 @@ export class EMPRuntime {
     }
   }
   public init(options: EmpInitOptionsType = {}) {
-    if (this.isInit) return
+    if (this.mfInstance) return this.mfInstance
     let op: InitOptionsType = {
       name: 'empRuntimeProject',
       remotes: [],
       // plugins: [catchErrorNextPlugin(this.options.showLog)],
     }
     op = deepAssign<InitOptionsType>(op, options)
-    this.libs.MFRuntime.init(op)
-    this.isInit = true
+    this.mfInstance = this.libs.MFRuntime.createInstance(op)
   }
   public load<T = any>(...args: LoadRemoteType) {
-    return this.libs.MFRuntime.loadRemote<T>(...args) as Promise<T>
+    return this.mfInstance?.loadRemote<T>(...args) as Promise<T>
+  }
+  public register(...args: Parameters<NonNullable<typeof this.mfInstance>['registerRemotes']>) {
+    return this.mfInstance?.registerRemotes(...args)
+  }
+  public preload(...args: Parameters<NonNullable<typeof this.mfInstance>['preloadRemote']>) {
+    return this.mfInstance?.preloadRemote(...args)
+  }
+  public loadShare(...args: Parameters<NonNullable<typeof this.mfInstance>['loadShare']>) {
+    return this.mfInstance?.loadShare(...args)
+  }
+  public preloadRemote(...args: Parameters<NonNullable<typeof this.mfInstance>['preloadRemote']>) {
+    return this.mfInstance?.preloadRemote(...args)
   }
-  public register = this.libs?.MFRuntime.registerRemotes
-  public preload = this.libs?.MFRuntime.preloadRemote
-  public loadShare = this.libs?.MFRuntime.loadShare
-  public preloadRemote = this.libs?.MFRuntime.preloadRemote
 }
 //
 export default new EMPRuntime()

packages/emp-share/src/runtime/mfRuntime.ts

@@ -0,0 +1 @@
+export * from '@module-federation/runtime'

packages/emp-share/tsup.config.ts

@@ -6,6 +6,7 @@ export default defineConfig(({watch}): Options[] => {
       entry: {
         index: 'src/index.ts',
         runtime: 'src/runtime/index.ts',
+        mfRuntime: 'src/runtime/mfRuntime.ts',
         adapter: 'src/adapter/index.ts',
         rspack: 'src/plugins/rspack/index.ts',
         adapterVue: 'src/adapter/vue.ts',

projects/mf-app/emp.config.ts

@@ -1,7 +1,6 @@
 import {defineConfig} from '@empjs/cli'
 import pluginReact from '@empjs/plugin-react'
 import pluginRspackEmpShare, {externalReact} from '@empjs/share/rspack'
-import getConfig from '../mf-host/emp.runtime'
 export default defineConfig(store => {
   // const ip = store.getLanIp()
   // const {empRuntime, polyfillCdn} = getConfig(ip, store)
@@ -43,6 +42,9 @@ export default defineConfig(store => {
             return o
           },
         },
+        dts: {
+          consumeTypes: true,
+        },
         // experiments: {
         //   federationRuntime: 'hoisted',
         // },

projects/mf-app/src/App.tsx

@@ -5,7 +5,7 @@ import Bound from './Bound'
 const App = () => (
   <div className={css.main}>
     <Bound name="MF-Host">
-      <Host from="fromMainAppName" nameformRemote="nameformRemote" />
+      <Host from="fromMainAppName" nameformRemote="nameformRemote" increment={1} />
     </Bound>
     <Bound name="MF-APP">
       <h1>mf-app</h1>

projects/mf-host/emp.config.ts

@@ -23,18 +23,18 @@ export default defineConfig(store => {
         //     requiredVersion: '18',
         //   },
         // },
-        experiments: {
-          asyncStartup: true,
-        },
+        // experiments: {
+        //   asyncStartup: true,
+        // },
         exposes: {
           './App': './src/App',
           './CountComp': './src/CountComp',
           './Section': './src/component/Section',
         },
         manifest: true,
-        // dts: {
-        //   generateTypes: true,
-        // },
+        dts: {
+          generateTypes: true,
+        },
         // dev: {
         //   disableHotTypesReload: false,
         //   disableDynamicRemoteTypeHints: false,
@@ -84,7 +84,7 @@ export default defineConfig(store => {
       // },
     },
     debug: {
-      // showRsconfig: true,
+      // showRsconfig: 'log.json',
       clearLog: false,
     },
     chain(config) {

projects/mf-host/src/App.tsx

@@ -11,6 +11,7 @@ type AppType = {
   version?: string
   component?: any
   nameformRemote?: string
+  increment?: number
 }
 console.log('test console')
 
@@ -24,7 +25,7 @@ function App(o: AppType) {
           {/* <ReactLogo /> */}
         </a>
       </div>
-      <h1>EMP 3.0 React {version} </h1>
+      <h1>EMP 3.0 React {version}</h1>
       <ShowCountComp />
       {o.from ? <p>{o.from}</p> : ''}
       {o.nameformRemote ? <p>{o.nameformRemote}</p> : ''}

projects/runtime-18-app/.mf/typesGenerate.log

@@ -0,0 +1,8 @@
+[2025-09-11T18:34:25.121] [WARN] Module Federation DTS - Connection closed with code 1006.
+[2025-09-11T18:34:25.122] [INFO] Module Federation DTS - start reconnecting to server after 1s.
+[2025-09-11T18:34:26.126] [INFO] Module Federation DTS - Publisher:runtime_app Trying to connect to ws://172.29.96.250:16322...
+[2025-09-11T18:34:26.140] [FATAL] Module Federation DTS - Failed to connect to ws://172.29.96.250:16322...
+[2025-09-11T18:34:26.141] [WARN] Module Federation DTS - Connection closed with code 1006.
+[2025-09-11T18:34:26.141] [INFO] Module Federation DTS - start reconnecting to server after 1s.
+[2025-09-11T18:34:26.218] [WARN] Module Federation DTS - Creating new background broker...
+[2025-09-11T18:34:26.384] [INFO] StartBroker - startBroker... 6819

projects/runtime-18-app/emp.config.ts

@@ -10,11 +10,11 @@ export default defineConfig(store => {
       pluginRspackEmpShare({
         name: `runtime_app`,
         manifest: true,
-        experiments: {
-          asyncStartup: true,
-        },
+        // experiments: {
+        //   asyncStartup: true,
+        // },
         exposes: {
-          './Title': './src/Title',
+          // './Title': './src/Title',
         },
         empRuntime: {
           framework: {
@@ -26,6 +26,10 @@ export default defineConfig(store => {
           },
           setExternals: externalReact,
         },
+        // dts: {
+        //   generateTypes: false,
+        //   consumeTypes: true,
+        // },
       }),
     ],
     build: {