!!!!!!!! new version to https://github.com/zhangHongEn/universal-module-federation-plugin/tree/main/packages/module-federation-runtime
Usemf is a jssdk (not a react hook) used to introduce module-federation in a non-webpack5 environment
- Modules of module federation can be introduced, and shared can be overwritten
- @module-federation/webpack-4
- If you need to use the module Federation library provided by yourself or a third party in a non webpack5 environment, you can use usemf
"Shared" is not required, and the "MF" module will automatically use the standby module
import usemf from "usemf" const app2 = usemf.import({ url: "http://localhost:3002/remoteEntry.js", name: "app2", })("./App")
- import({url, name, shared: {shareScope, pkg}, customGetContainer})
- getShareScopes()
- getContainer({url, name, customGetContainer})
- getShare(name, {requiredVersion,shareScope,singleton,strictVersion}, shareScopes)
import React from "react"; import usemf from "usemf" const shared = { // You can provide shared React to make app2 not use the standby react module to achieve react singleton react: { version: "17.0.2", async get () { // const res = await window.System.import("https://unpkg.com/react@17.0.2/umd/react.development.js") return function () { return React } } }, "react-dom": { version: "17.0.2", async get () { return function () { return { test: "react-dom" } } } } } const app2 = usemf.import({ url: "http://localhost:3002/remoteEntry.js", name: "app2", shared: { react: shared.react } })("./App") const app3 = usemf.import({ url: "http://localhost:3003/remoteEntry.js", name: "app3", shared })("./App") const App2 = React.lazy(() => app2) const App2_2 = React.lazy(() => app3)