@module-federation/modern-js 0.0.0-next-20241010084324 → 0.0.0-next-20241011105718
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/cli/dataLoader/ast/constant.js +49 -0
- package/dist/cjs/cli/dataLoader/ast/generateRoutes.js +143 -0
- package/dist/cjs/cli/{constant.js → dataLoader/ast/index.js} +6 -6
- package/dist/cjs/cli/dataLoader/clearMFCache.js +57 -0
- package/dist/cjs/cli/dataLoader/generateRouteFile.js +148 -0
- package/dist/cjs/cli/dataLoader/patchMFConfig.js +137 -0
- package/dist/cjs/cli/dataLoader/plugin.js +219 -0
- package/dist/cjs/cli/index.js +5 -1
- package/dist/cjs/cli/mfRuntimePlugins/{inject-node-fetch.js → node-fetch.js} +6 -6
- package/dist/cjs/cli/mfRuntimePlugins/node.js +41 -0
- package/dist/cjs/cli/mfRuntimePlugins/resolve-entry-ipv4.js +40 -38
- package/dist/cjs/cli/server/dataLoaderPlugin.js +81 -0
- package/dist/cjs/cli/server/fetchRemoteFullRoutesMap.js +72 -0
- package/dist/cjs/cli/ssrPlugin.js +5 -2
- package/dist/cjs/cli/utils.js +11 -6
- package/dist/cjs/cli/utils.spec.js +5 -6
- package/dist/cjs/constant.js +35 -2
- package/dist/cjs/interfaces/route.js +16 -0
- package/dist/cjs/runtime/dataLoader/plugin-inject-assets.js +92 -0
- package/dist/cjs/runtime/dataLoader/plugin.js +75 -0
- package/dist/cjs/runtime/dataLoader/utils.js +115 -0
- package/dist/cjs/runtime/index.js +4 -1
- package/dist/cjs/{cli/mfRuntimePlugins/shared-strategy.js → runtime/withMFRouteId.js} +11 -23
- package/dist/cjs/ssr-runtime/plugin.js +7 -8
- package/dist/cjs/types/modern.js +16 -0
- package/dist/esm/cli/dataLoader/ast/constant.js +18 -0
- package/dist/esm/cli/dataLoader/ast/generateRoutes.js +110 -0
- package/dist/esm/cli/dataLoader/ast/index.js +4 -0
- package/dist/esm/cli/dataLoader/clearMFCache.js +34 -0
- package/dist/esm/cli/dataLoader/generateRouteFile.js +308 -0
- package/dist/esm/cli/dataLoader/patchMFConfig.js +103 -0
- package/dist/esm/cli/dataLoader/plugin.js +341 -0
- package/dist/esm/cli/index.js +6 -2
- package/dist/esm/cli/mfRuntimePlugins/{inject-node-fetch.js → node-fetch.js} +3 -3
- package/dist/esm/cli/mfRuntimePlugins/node.js +13 -0
- package/dist/esm/cli/server/dataLoaderPlugin.js +104 -0
- package/dist/esm/cli/server/fetchRemoteFullRoutesMap.js +93 -0
- package/dist/esm/cli/ssrPlugin.js +6 -3
- package/dist/esm/cli/utils.js +13 -8
- package/dist/esm/cli/utils.spec.js +5 -6
- package/dist/esm/constant.js +23 -1
- package/dist/esm/interfaces/route.js +0 -0
- package/dist/esm/runtime/dataLoader/plugin-inject-assets.js +71 -0
- package/dist/esm/runtime/dataLoader/plugin.js +97 -0
- package/dist/esm/runtime/dataLoader/utils.js +86 -0
- package/dist/esm/runtime/index.js +3 -1
- package/dist/esm/runtime/withMFRouteId.js +7 -0
- package/dist/esm/ssr-runtime/plugin.js +8 -11
- package/dist/esm/types/modern.js +0 -0
- package/dist/esm-node/cli/dataLoader/ast/constant.js +18 -0
- package/dist/esm-node/cli/dataLoader/ast/generateRoutes.js +109 -0
- package/dist/esm-node/cli/dataLoader/ast/index.js +4 -0
- package/dist/esm-node/cli/dataLoader/clearMFCache.js +33 -0
- package/dist/esm-node/cli/dataLoader/generateRouteFile.js +113 -0
- package/dist/esm-node/cli/dataLoader/patchMFConfig.js +103 -0
- package/dist/esm-node/cli/dataLoader/plugin.js +184 -0
- package/dist/esm-node/cli/index.js +5 -1
- package/dist/esm-node/cli/mfRuntimePlugins/{inject-node-fetch.js → node-fetch.js} +3 -3
- package/dist/esm-node/cli/mfRuntimePlugins/node.js +11 -0
- package/dist/esm-node/cli/mfRuntimePlugins/resolve-entry-ipv4.js +40 -38
- package/dist/esm-node/cli/server/dataLoaderPlugin.js +61 -0
- package/dist/esm-node/cli/server/fetchRemoteFullRoutesMap.js +47 -0
- package/dist/esm-node/cli/ssrPlugin.js +5 -2
- package/dist/esm-node/cli/utils.js +9 -5
- package/dist/esm-node/cli/utils.spec.js +5 -6
- package/dist/esm-node/constant.js +23 -1
- package/dist/esm-node/interfaces/route.js +0 -0
- package/dist/esm-node/runtime/dataLoader/plugin-inject-assets.js +68 -0
- package/dist/esm-node/runtime/dataLoader/plugin.js +51 -0
- package/dist/esm-node/runtime/dataLoader/utils.js +86 -0
- package/dist/esm-node/runtime/index.js +3 -1
- package/dist/esm-node/runtime/withMFRouteId.js +7 -0
- package/dist/esm-node/ssr-runtime/plugin.js +7 -8
- package/dist/esm-node/types/modern.js +0 -0
- package/dist/types/cli/dataLoader/ast/constant.d.ts +8 -0
- package/dist/types/cli/dataLoader/ast/generateRoutes.d.ts +5 -0
- package/dist/types/cli/dataLoader/ast/index.d.ts +1 -0
- package/dist/types/cli/dataLoader/clearMFCache.d.ts +1 -0
- package/dist/types/cli/dataLoader/generateRouteFile.d.ts +10 -0
- package/dist/types/cli/dataLoader/patchMFConfig.d.ts +10 -0
- package/dist/types/cli/dataLoader/plugin.d.ts +6 -0
- package/dist/types/cli/mfRuntimePlugins/node.d.ts +3 -0
- package/dist/types/cli/server/dataLoaderPlugin.d.ts +10 -0
- package/dist/types/cli/server/fetchRemoteFullRoutesMap.d.ts +11 -0
- package/dist/types/cli/utils.d.ts +2 -0
- package/dist/types/constant.d.ts +11 -0
- package/dist/types/interfaces/route.d.ts +12 -0
- package/dist/types/runtime/dataLoader/plugin-inject-assets.d.ts +4 -0
- package/dist/types/runtime/dataLoader/plugin.d.ts +5 -0
- package/dist/types/runtime/dataLoader/utils.d.ts +22 -0
- package/dist/types/runtime/index.d.ts +1 -0
- package/dist/types/runtime/withMFRouteId.d.ts +1 -0
- package/dist/types/ssr-runtime/plugin.d.ts +3 -1
- package/dist/types/types/index.d.ts +8 -0
- package/dist/types/types/modern.d.ts +12 -0
- package/package.json +48 -11
- package/dist/esm/cli/constant.js +0 -4
- package/dist/esm/cli/mfRuntimePlugins/shared-strategy.js +0 -25
- package/dist/esm-node/cli/constant.js +0 -4
- package/dist/esm-node/cli/mfRuntimePlugins/shared-strategy.js +0 -23
- package/dist/types/cli/constant.d.ts +0 -1
- package/dist/types/cli/mfRuntimePlugins/shared-strategy.d.ts +0 -3
- /package/dist/types/cli/mfRuntimePlugins/{inject-node-fetch.d.ts → node-fetch.d.ts} +0 -0
package/dist/esm/cli/utils.js
CHANGED
|
@@ -2,6 +2,7 @@ import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
|
|
|
2
2
|
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
3
3
|
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
4
4
|
import { _ as _to_consumable_array } from "@swc/helpers/_/_to_consumable_array";
|
|
5
|
+
import { _ as _type_of } from "@swc/helpers/_/_type_of";
|
|
5
6
|
import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
|
6
7
|
import { encodeName } from "@module-federation/sdk";
|
|
7
8
|
import path from "path";
|
|
@@ -69,7 +70,7 @@ var replaceRemoteUrl = function(mfConfig, remoteIpStrategy) {
|
|
|
69
70
|
if (typeof remote === "string" && remote.includes(LOCALHOST)) {
|
|
70
71
|
remoteObject[remoteKey] = remote.replace(LOCALHOST, ipv4);
|
|
71
72
|
}
|
|
72
|
-
if (typeof remote === "object" && !Array.isArray(remote.external) && remote.external.includes(LOCALHOST)) {
|
|
73
|
+
if ((typeof remote === "undefined" ? "undefined" : _type_of(remote)) === "object" && !Array.isArray(remote.external) && remote.external.includes(LOCALHOST)) {
|
|
73
74
|
remote.external = remote.external.replace(LOCALHOST, ipv4);
|
|
74
75
|
}
|
|
75
76
|
});
|
|
@@ -79,7 +80,9 @@ var replaceRemoteUrl = function(mfConfig, remoteIpStrategy) {
|
|
|
79
80
|
if (typeof remoteObject === "string") {
|
|
80
81
|
return;
|
|
81
82
|
}
|
|
82
|
-
|
|
83
|
+
if ("entry" in remoteObject && typeof remoteObject.entry === "string") {
|
|
84
|
+
remoteObject.entry = remoteObject.entry.replace(LOCALHOST, ipv4);
|
|
85
|
+
}
|
|
83
86
|
});
|
|
84
87
|
} else if (typeof mfConfig.remotes !== "string") {
|
|
85
88
|
handleRemoteObject(mfConfig.remotes);
|
|
@@ -126,17 +129,18 @@ var patchMFConfig = function(mfConfig, isServer, remoteIpStrategy) {
|
|
|
126
129
|
throw new Error("".concat(PLUGIN_IDENTIFIER, " mfConfig.name can not be empty!"));
|
|
127
130
|
}
|
|
128
131
|
var runtimePlugins = _to_consumable_array(mfConfig.runtimePlugins || []);
|
|
132
|
+
var _mfConfig_shareStrategy;
|
|
133
|
+
mfConfig.shareStrategy = (_mfConfig_shareStrategy = mfConfig.shareStrategy) !== null && _mfConfig_shareStrategy !== void 0 ? _mfConfig_shareStrategy : "loaded-first";
|
|
129
134
|
patchDTSConfig(mfConfig, isServer);
|
|
130
|
-
injectRuntimePlugins(path.resolve(__dirname, "./mfRuntimePlugins/shared-strategy.js"), runtimePlugins);
|
|
131
135
|
if (isDev) {
|
|
132
136
|
injectRuntimePlugins(path.resolve(__dirname, "./mfRuntimePlugins/resolve-entry-ipv4.js"), runtimePlugins);
|
|
133
137
|
}
|
|
134
138
|
if (isServer) {
|
|
135
|
-
injectRuntimePlugins(
|
|
139
|
+
injectRuntimePlugins(path.resolve(__dirname, "./mfRuntimePlugins/node.js"), runtimePlugins);
|
|
136
140
|
if (isDev) {
|
|
137
141
|
injectRuntimePlugins(require.resolve("@module-federation/node/record-dynamic-remote-entry-hash-plugin"), runtimePlugins);
|
|
138
142
|
}
|
|
139
|
-
injectRuntimePlugins(path.resolve(__dirname, "./mfRuntimePlugins/
|
|
143
|
+
injectRuntimePlugins(path.resolve(__dirname, "./mfRuntimePlugins/node-fetch.js"), runtimePlugins);
|
|
140
144
|
if (!mfConfig.library) {
|
|
141
145
|
mfConfig.library = {
|
|
142
146
|
type: "commonjs-module",
|
|
@@ -197,7 +201,7 @@ function patchBundlerConfig(options) {
|
|
|
197
201
|
}
|
|
198
202
|
}
|
|
199
203
|
if (mfConfig.dts !== false) {
|
|
200
|
-
if (
|
|
204
|
+
if (_type_of(mfConfig.dts) === "object" && _type_of(mfConfig.dts.consumeTypes) === "object" && mfConfig.dts.consumeTypes.remoteTypesFolder) {
|
|
201
205
|
bundlerConfig.watchOptions.ignored.push("**/".concat(mfConfig.dts.consumeTypes.remoteTypesFolder, "/**"));
|
|
202
206
|
} else {
|
|
203
207
|
bundlerConfig.watchOptions.ignored.push("**/@mf-types/**");
|
|
@@ -218,7 +222,7 @@ function patchBundlerConfig(options) {
|
|
|
218
222
|
if (!isServer) {
|
|
219
223
|
autoDeleteSplitChunkCacheGroups(mfConfig, bundlerConfig);
|
|
220
224
|
}
|
|
221
|
-
if (!isServer && enableSSR &&
|
|
225
|
+
if (!isServer && enableSSR && _type_of((_bundlerConfig_optimization1 = bundlerConfig.optimization) === null || _bundlerConfig_optimization1 === void 0 ? void 0 : _bundlerConfig_optimization1.splitChunks) === "object" && bundlerConfig.optimization.splitChunks.cacheGroups) {
|
|
222
226
|
bundlerConfig.optimization.splitChunks.chunks = "async";
|
|
223
227
|
console.warn("".concat(PLUGIN_IDENTIFIER, ' splitChunks.chunks = async is not allowed with stream SSR mode, it will auto changed to "async"'));
|
|
224
228
|
}
|
|
@@ -339,5 +343,6 @@ export {
|
|
|
339
343
|
getMFConfig,
|
|
340
344
|
patchBundlerConfig,
|
|
341
345
|
patchIgnoreWarning,
|
|
342
|
-
patchMFConfig
|
|
346
|
+
patchMFConfig,
|
|
347
|
+
replaceRemoteUrl
|
|
343
348
|
};
|
|
@@ -41,10 +41,10 @@ describe("patchMFConfig", /* @__PURE__ */ _async_to_generator(function() {
|
|
|
41
41
|
remote: "http://".concat(ipv4, ":3000/remoteEntry.js")
|
|
42
42
|
},
|
|
43
43
|
remoteType: "script",
|
|
44
|
+
shareStrategy: "loaded-first",
|
|
44
45
|
runtimePlugins: [
|
|
45
|
-
path.resolve(__dirname, "./mfRuntimePlugins/
|
|
46
|
-
|
|
47
|
-
path.resolve(__dirname, "./mfRuntimePlugins/inject-node-fetch.js")
|
|
46
|
+
path.resolve(__dirname, "./mfRuntimePlugins/node.js"),
|
|
47
|
+
path.resolve(__dirname, "./mfRuntimePlugins/node-fetch.js")
|
|
48
48
|
],
|
|
49
49
|
shared: {
|
|
50
50
|
react: {
|
|
@@ -75,9 +75,8 @@ describe("patchMFConfig", /* @__PURE__ */ _async_to_generator(function() {
|
|
|
75
75
|
remote: "http://".concat(ipv4, ":3000/remoteEntry.js")
|
|
76
76
|
},
|
|
77
77
|
remoteType: "script",
|
|
78
|
-
runtimePlugins: [
|
|
79
|
-
|
|
80
|
-
],
|
|
78
|
+
runtimePlugins: [],
|
|
79
|
+
shareStrategy: "loaded-first",
|
|
81
80
|
shared: {
|
|
82
81
|
react: {
|
|
83
82
|
eager: true,
|
package/dist/esm/constant.js
CHANGED
|
@@ -1,8 +1,30 @@
|
|
|
1
1
|
var MODERN_JS_SERVER_DIR = "bundles";
|
|
2
2
|
var LOCALHOST = "localhost";
|
|
3
3
|
var PLUGIN_IDENTIFIER = "[ Modern.js Module Federation ]";
|
|
4
|
+
var isDev = process.env.NODE_ENV === "development";
|
|
5
|
+
var MODERN_JS_FILE_SYSTEM_ROUTES_FILE_NAME = "routes";
|
|
6
|
+
var MODERN_JS_ROUTE_SERVER_LOADER = "route-server-loaders";
|
|
7
|
+
var META_NAME = "modern-js";
|
|
8
|
+
var FOLD_IDENTIFIER = "@mf";
|
|
9
|
+
var SEPARATOR = "_";
|
|
10
|
+
var MF_ROUTES = "mf-routes";
|
|
11
|
+
var DEFAULT_ENTRY = "main";
|
|
12
|
+
var DEFAULT_LAYOUT = "layout";
|
|
13
|
+
var MF_JSON = "mf.json";
|
|
14
|
+
var ROUTE_ID = "ROUTE_ID";
|
|
4
15
|
export {
|
|
16
|
+
DEFAULT_ENTRY,
|
|
17
|
+
DEFAULT_LAYOUT,
|
|
18
|
+
FOLD_IDENTIFIER,
|
|
5
19
|
LOCALHOST,
|
|
20
|
+
META_NAME,
|
|
21
|
+
MF_JSON,
|
|
22
|
+
MF_ROUTES,
|
|
23
|
+
MODERN_JS_FILE_SYSTEM_ROUTES_FILE_NAME,
|
|
24
|
+
MODERN_JS_ROUTE_SERVER_LOADER,
|
|
6
25
|
MODERN_JS_SERVER_DIR,
|
|
7
|
-
PLUGIN_IDENTIFIER
|
|
26
|
+
PLUGIN_IDENTIFIER,
|
|
27
|
+
ROUTE_ID,
|
|
28
|
+
SEPARATOR,
|
|
29
|
+
isDev
|
|
8
30
|
};
|
|
File without changes
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import { _ as _to_consumable_array } from "@swc/helpers/_/_to_consumable_array";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
+
import { useContext } from "react";
|
|
4
|
+
import { getInstance } from "@module-federation/enhanced/runtime";
|
|
5
|
+
import { collectSSRAssets } from "../createRemoteSSRComponent";
|
|
6
|
+
import { RuntimeReactContext } from "@meta/runtime";
|
|
7
|
+
import { decodeId, getRemoteId } from "./utils";
|
|
8
|
+
function traverseRoutes(routes, remoteNames) {
|
|
9
|
+
routes.forEach(function(route) {
|
|
10
|
+
route.id && remoteNames.add(decodeId(route.id));
|
|
11
|
+
route.children && traverseRoutes(route.children, remoteNames);
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
var ssrDataLoaderInjectAssetsPlugin = function(param) {
|
|
15
|
+
var metaName = param.metaName;
|
|
16
|
+
return {
|
|
17
|
+
name: "@modern-js/plugin-mf-data-loader-inject-assets",
|
|
18
|
+
pre: [
|
|
19
|
+
"@modern-js/plugin-mf-data-loader"
|
|
20
|
+
],
|
|
21
|
+
post: [
|
|
22
|
+
"@module-federation/modern-js",
|
|
23
|
+
"@".concat(metaName, "/plugin-router")
|
|
24
|
+
],
|
|
25
|
+
setup: function() {
|
|
26
|
+
return {
|
|
27
|
+
wrapRoot: function wrapRoot(App) {
|
|
28
|
+
var AppWrapper = function(props) {
|
|
29
|
+
var instance = getInstance();
|
|
30
|
+
if (!instance || !instance.options.remotes.length) {
|
|
31
|
+
return /* @__PURE__ */ _jsx(_Fragment, {
|
|
32
|
+
children: props.children
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
var context = useContext(RuntimeReactContext);
|
|
36
|
+
var remotes = instance.options.remotes;
|
|
37
|
+
var remoteNames = /* @__PURE__ */ new Set();
|
|
38
|
+
traverseRoutes(context.routes, remoteNames);
|
|
39
|
+
var remoteIds = _to_consumable_array(remoteNames).reduce(function(sum, cur) {
|
|
40
|
+
var matchRemote = remotes.find(function(r) {
|
|
41
|
+
return r.name === cur;
|
|
42
|
+
});
|
|
43
|
+
if (matchRemote) {
|
|
44
|
+
sum.add(getRemoteId(cur));
|
|
45
|
+
}
|
|
46
|
+
return sum;
|
|
47
|
+
}, /* @__PURE__ */ new Set());
|
|
48
|
+
var assets = [];
|
|
49
|
+
remoteIds.forEach(function(remoteId) {
|
|
50
|
+
var _assets;
|
|
51
|
+
(_assets = assets).push.apply(_assets, _to_consumable_array(collectSSRAssets({
|
|
52
|
+
id: remoteId,
|
|
53
|
+
injectScript: false
|
|
54
|
+
})));
|
|
55
|
+
});
|
|
56
|
+
return /* @__PURE__ */ _jsxs(_Fragment, {
|
|
57
|
+
children: [
|
|
58
|
+
assets,
|
|
59
|
+
props.children
|
|
60
|
+
]
|
|
61
|
+
});
|
|
62
|
+
};
|
|
63
|
+
return AppWrapper;
|
|
64
|
+
}
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
};
|
|
68
|
+
};
|
|
69
|
+
export {
|
|
70
|
+
ssrDataLoaderInjectAssetsPlugin
|
|
71
|
+
};
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
|
|
2
|
+
import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
|
3
|
+
import { getInstance } from "@module-federation/enhanced/runtime";
|
|
4
|
+
import { MF_ROUTES, DEFAULT_ENTRY } from "../../constant";
|
|
5
|
+
import { injectRemoteRoutes } from "./utils";
|
|
6
|
+
var ssrDataLoaderPlugin = function(param) {
|
|
7
|
+
var metaName = param.metaName, dataLoaderRemotes = param.dataLoaderRemotes;
|
|
8
|
+
return {
|
|
9
|
+
name: "@modern-js/plugin-mf-data-loader",
|
|
10
|
+
post: [
|
|
11
|
+
"@".concat(metaName, "/plugin-router"),
|
|
12
|
+
"@module-federation/modern-js"
|
|
13
|
+
],
|
|
14
|
+
setup: function() {
|
|
15
|
+
var remoteRoutesMap = {};
|
|
16
|
+
return {
|
|
17
|
+
beforeRender: function beforeRender() {
|
|
18
|
+
return _async_to_generator(function() {
|
|
19
|
+
var instance;
|
|
20
|
+
return _ts_generator(this, function(_state) {
|
|
21
|
+
switch (_state.label) {
|
|
22
|
+
case 0:
|
|
23
|
+
if (Object.keys(remoteRoutesMap).length) {
|
|
24
|
+
return [
|
|
25
|
+
2
|
|
26
|
+
];
|
|
27
|
+
}
|
|
28
|
+
instance = getInstance();
|
|
29
|
+
if (!instance) {
|
|
30
|
+
return [
|
|
31
|
+
2
|
|
32
|
+
];
|
|
33
|
+
}
|
|
34
|
+
if (!instance.options.remotes.length) {
|
|
35
|
+
return [
|
|
36
|
+
2
|
|
37
|
+
];
|
|
38
|
+
}
|
|
39
|
+
return [
|
|
40
|
+
4,
|
|
41
|
+
Promise.all(instance.options.remotes.map(function() {
|
|
42
|
+
var _ref = _async_to_generator(function(remote) {
|
|
43
|
+
var remoteId, routes;
|
|
44
|
+
return _ts_generator(this, function(_state2) {
|
|
45
|
+
switch (_state2.label) {
|
|
46
|
+
case 0:
|
|
47
|
+
if (!dataLoaderRemotes.includes(remote.name)) {
|
|
48
|
+
return [
|
|
49
|
+
2
|
|
50
|
+
];
|
|
51
|
+
}
|
|
52
|
+
remoteId = "".concat(remote.name, "/").concat(DEFAULT_ENTRY, "/").concat(MF_ROUTES);
|
|
53
|
+
return [
|
|
54
|
+
4,
|
|
55
|
+
instance.loadRemote(remoteId)
|
|
56
|
+
];
|
|
57
|
+
case 1:
|
|
58
|
+
routes = _state2.sent().routes;
|
|
59
|
+
remoteRoutesMap[remote.name] = {
|
|
60
|
+
routes
|
|
61
|
+
};
|
|
62
|
+
return [
|
|
63
|
+
2
|
|
64
|
+
];
|
|
65
|
+
}
|
|
66
|
+
});
|
|
67
|
+
});
|
|
68
|
+
return function(remote) {
|
|
69
|
+
return _ref.apply(this, arguments);
|
|
70
|
+
};
|
|
71
|
+
}()))
|
|
72
|
+
];
|
|
73
|
+
case 1:
|
|
74
|
+
_state.sent();
|
|
75
|
+
return [
|
|
76
|
+
2
|
|
77
|
+
];
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
})();
|
|
81
|
+
},
|
|
82
|
+
// runtime plugin not save route , so it needs to inject again when trigger
|
|
83
|
+
modifyRoutes: function(routes) {
|
|
84
|
+
injectRemoteRoutes({
|
|
85
|
+
entry: {
|
|
86
|
+
routes
|
|
87
|
+
}
|
|
88
|
+
}, remoteRoutesMap);
|
|
89
|
+
return routes;
|
|
90
|
+
}
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
};
|
|
94
|
+
};
|
|
95
|
+
export {
|
|
96
|
+
ssrDataLoaderPlugin
|
|
97
|
+
};
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { encodeName, decodeName } from "@module-federation/sdk";
|
|
2
|
+
import { DEFAULT_ENTRY, DEFAULT_LAYOUT, MF_ROUTES } from "../../constant";
|
|
3
|
+
var SPLIT_SYMBOL = "@";
|
|
4
|
+
function transformName2Prefix(name) {
|
|
5
|
+
return "".concat(encodeName(name, "", false)).concat(SPLIT_SYMBOL);
|
|
6
|
+
}
|
|
7
|
+
function decodeId(prefix) {
|
|
8
|
+
var realPrefix = prefix.split(SPLIT_SYMBOL)[0];
|
|
9
|
+
return decodeName(realPrefix, "", false);
|
|
10
|
+
}
|
|
11
|
+
function getRemoteRoutesInfos(route, remoteRoutesMap) {
|
|
12
|
+
if (!route.id) {
|
|
13
|
+
return;
|
|
14
|
+
}
|
|
15
|
+
var remoteName = decodeId(route.id);
|
|
16
|
+
var remoteRouteObj = remoteRoutesMap[remoteName];
|
|
17
|
+
if (!remoteRouteObj) {
|
|
18
|
+
return;
|
|
19
|
+
}
|
|
20
|
+
var remoteRoutes = remoteRouteObj.routes[0];
|
|
21
|
+
return {
|
|
22
|
+
routes: remoteRoutes,
|
|
23
|
+
name: remoteName,
|
|
24
|
+
pathName: route.path
|
|
25
|
+
};
|
|
26
|
+
}
|
|
27
|
+
function getRemoteLayoutId(remoteName) {
|
|
28
|
+
var prefix = transformName2Prefix(remoteName);
|
|
29
|
+
return "".concat(prefix).concat(DEFAULT_LAYOUT);
|
|
30
|
+
}
|
|
31
|
+
function getRemoteId(remoteName) {
|
|
32
|
+
return "".concat(remoteName, "/").concat(DEFAULT_ENTRY, "/").concat(MF_ROUTES);
|
|
33
|
+
}
|
|
34
|
+
function injectRemoteRoutes(initialRoutes, remoteRoutesMap) {
|
|
35
|
+
var traverse = function(route) {
|
|
36
|
+
var _route_children;
|
|
37
|
+
var remoteRoutesInfos = getRemoteRoutesInfos(route, remoteRoutesMap);
|
|
38
|
+
if (remoteRoutesInfos) {
|
|
39
|
+
var routes = remoteRoutesInfos.routes, pathName = remoteRoutesInfos.pathName;
|
|
40
|
+
route.id = routes.id;
|
|
41
|
+
route.path = pathName;
|
|
42
|
+
if (routes.loader) {
|
|
43
|
+
route.loader = routes.loader;
|
|
44
|
+
}
|
|
45
|
+
if (routes.children) {
|
|
46
|
+
route.children = routes.children;
|
|
47
|
+
}
|
|
48
|
+
if (routes.Component) {
|
|
49
|
+
route.Component = routes.Component;
|
|
50
|
+
if (route.element) {
|
|
51
|
+
delete route.element;
|
|
52
|
+
}
|
|
53
|
+
} else if (routes.element) {
|
|
54
|
+
route.element = routes.element;
|
|
55
|
+
if (route.Component) {
|
|
56
|
+
delete route.Component;
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
(_route_children = route.children) === null || _route_children === void 0 ? void 0 : _route_children.forEach(function(r) {
|
|
62
|
+
traverse(r);
|
|
63
|
+
});
|
|
64
|
+
};
|
|
65
|
+
Object.keys(initialRoutes).forEach(function(entryName) {
|
|
66
|
+
var routes = initialRoutes[entryName];
|
|
67
|
+
if (Array.isArray(routes)) {
|
|
68
|
+
routes.forEach(function(route) {
|
|
69
|
+
traverse(route);
|
|
70
|
+
});
|
|
71
|
+
} else {
|
|
72
|
+
var _routes_routes;
|
|
73
|
+
routes === null || routes === void 0 ? void 0 : (_routes_routes = routes.routes) === null || _routes_routes === void 0 ? void 0 : _routes_routes.forEach(function(r) {
|
|
74
|
+
traverse(r);
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
export {
|
|
80
|
+
decodeId,
|
|
81
|
+
getRemoteId,
|
|
82
|
+
getRemoteLayoutId,
|
|
83
|
+
getRemoteRoutesInfos,
|
|
84
|
+
injectRemoteRoutes,
|
|
85
|
+
transformName2Prefix
|
|
86
|
+
};
|
|
@@ -4,13 +4,16 @@ import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
|
|
4
4
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
5
5
|
import hoistNonReactStatics from "hoist-non-react-statics";
|
|
6
6
|
import { SSRLiveReload } from "./SSRLiveReload";
|
|
7
|
-
var mfSSRPlugin = function() {
|
|
7
|
+
var mfSSRPlugin = function(param) {
|
|
8
|
+
var metaName = param.metaName;
|
|
8
9
|
return {
|
|
9
10
|
name: "@module-federation/modern-js",
|
|
11
|
+
pre: [
|
|
12
|
+
"@".concat(metaName, "/plugin-router")
|
|
13
|
+
],
|
|
10
14
|
setup: function() {
|
|
11
15
|
return {
|
|
12
|
-
|
|
13
|
-
var context = param.context;
|
|
16
|
+
beforeRender: function beforeRender() {
|
|
14
17
|
return _async_to_generator(function() {
|
|
15
18
|
var nodeUtils, shouldUpdate;
|
|
16
19
|
return _ts_generator(this, function(_state) {
|
|
@@ -18,10 +21,7 @@ var mfSSRPlugin = function() {
|
|
|
18
21
|
case 0:
|
|
19
22
|
if (typeof window !== "undefined") {
|
|
20
23
|
return [
|
|
21
|
-
2
|
|
22
|
-
next({
|
|
23
|
-
context
|
|
24
|
-
})
|
|
24
|
+
2
|
|
25
25
|
];
|
|
26
26
|
}
|
|
27
27
|
globalThis.shouldUpdate = false;
|
|
@@ -53,10 +53,7 @@ var mfSSRPlugin = function() {
|
|
|
53
53
|
_state.label = 4;
|
|
54
54
|
case 4:
|
|
55
55
|
return [
|
|
56
|
-
2
|
|
57
|
-
next({
|
|
58
|
-
context
|
|
59
|
-
})
|
|
56
|
+
2
|
|
60
57
|
];
|
|
61
58
|
}
|
|
62
59
|
});
|
|
File without changes
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
const IS_ROOT = "isRoot";
|
|
2
|
+
const ID = "id";
|
|
3
|
+
const COMPONENT = "component";
|
|
4
|
+
const LAZY_COMPONENT = "lazyImport";
|
|
5
|
+
const SHOULD_REVALIDATE = "shouldRevalidate";
|
|
6
|
+
const PRIVATE_COMPONENT = "_component";
|
|
7
|
+
const ELEMENT = "element";
|
|
8
|
+
const LOADER = "loader";
|
|
9
|
+
export {
|
|
10
|
+
COMPONENT,
|
|
11
|
+
ELEMENT,
|
|
12
|
+
ID,
|
|
13
|
+
IS_ROOT,
|
|
14
|
+
LAZY_COMPONENT,
|
|
15
|
+
LOADER,
|
|
16
|
+
PRIVATE_COMPONENT,
|
|
17
|
+
SHOULD_REVALIDATE
|
|
18
|
+
};
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import fs from "fs";
|
|
2
|
+
import traverse from "@babel/traverse";
|
|
3
|
+
import * as babelParser from "@babel/parser";
|
|
4
|
+
import generate from "@babel/generator";
|
|
5
|
+
import * as t from "@babel/types";
|
|
6
|
+
function findTargetKeyNode(nodeProperties, key) {
|
|
7
|
+
return nodeProperties.find((p) => t.isObjectProperty(p) && t.isStringLiteral(p.key) && p.key.value === key);
|
|
8
|
+
}
|
|
9
|
+
function generateRoutes({ sourceCode, filePath }) {
|
|
10
|
+
const ast = babelParser.parse(sourceCode, {
|
|
11
|
+
sourceType: "module"
|
|
12
|
+
});
|
|
13
|
+
const lazyComponentDeclarations = [];
|
|
14
|
+
const componentDeclarations = [];
|
|
15
|
+
let componentId = 0;
|
|
16
|
+
traverse(ast, {
|
|
17
|
+
// ImportDeclaration(path) {
|
|
18
|
+
// const source = path.node.source.value;
|
|
19
|
+
// const routeIdMatch = source.match(/routeId=([^&]+)/);
|
|
20
|
+
// if (routeIdMatch) {
|
|
21
|
+
// const originalRouteId = routeIdMatch[1];
|
|
22
|
+
// const newRouteId = `${prefix}${originalRouteId}`;
|
|
23
|
+
// const newSource = source.replace(
|
|
24
|
+
// /routeId=[^&]+/,
|
|
25
|
+
// `routeId=${newRouteId}`,
|
|
26
|
+
// );
|
|
27
|
+
// path.node.source = t.stringLiteral(newSource);
|
|
28
|
+
// }
|
|
29
|
+
// },
|
|
30
|
+
ObjectExpression(path) {
|
|
31
|
+
let componentName = "";
|
|
32
|
+
let lazyComponentName = "";
|
|
33
|
+
if (!Array.isArray(path.node.properties)) {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
const idNode = findTargetKeyNode(path.node.properties, "id");
|
|
37
|
+
if (idNode && t.isObjectProperty(idNode) && t.isStringLiteral(idNode.value)) {
|
|
38
|
+
}
|
|
39
|
+
const isRootNode = findTargetKeyNode(path.node.properties, "isRoot");
|
|
40
|
+
if (isRootNode && t.isObjectProperty(isRootNode) && t.isBooleanLiteral(isRootNode.value)) {
|
|
41
|
+
isRootNode.value.value = false;
|
|
42
|
+
}
|
|
43
|
+
const lazyComponentNode = findTargetKeyNode(path.node.properties, "lazyImport");
|
|
44
|
+
if (lazyComponentNode && t.isObjectProperty(lazyComponentNode) && t.isArrowFunctionExpression(lazyComponentNode.value)) {
|
|
45
|
+
lazyComponentName = `LazyComponent_${componentId}`;
|
|
46
|
+
const lazyDeclaration = t.variableDeclaration("const", [
|
|
47
|
+
t.variableDeclarator(t.identifier(lazyComponentName), lazyComponentNode.value)
|
|
48
|
+
]);
|
|
49
|
+
lazyComponentNode.value = t.identifier(lazyComponentName);
|
|
50
|
+
const componentNode2 = findTargetKeyNode(path.node.properties, "component");
|
|
51
|
+
if (componentNode2 && t.isObjectProperty(componentNode2) && t.isCallExpression(componentNode2.value) && t.isIdentifier(componentNode2.value.callee)) {
|
|
52
|
+
componentNode2.value = t.callExpression(t.identifier("lazy"), [
|
|
53
|
+
t.identifier(lazyComponentName)
|
|
54
|
+
]);
|
|
55
|
+
}
|
|
56
|
+
lazyComponentDeclarations.push(lazyDeclaration);
|
|
57
|
+
}
|
|
58
|
+
const componentNode = findTargetKeyNode(path.node.properties, "component");
|
|
59
|
+
if (componentNode && t.isObjectProperty(componentNode) && t.isCallExpression(componentNode.value) && t.isIdentifier(componentNode.value.callee)) {
|
|
60
|
+
componentName = `Component_${componentId}`;
|
|
61
|
+
const componentDeclaration = t.variableDeclaration("const", [
|
|
62
|
+
t.variableDeclarator(t.identifier(componentName), lazyComponentName ? t.callExpression(t.identifier("lazy"), [
|
|
63
|
+
t.identifier(lazyComponentName)
|
|
64
|
+
]) : componentNode.value)
|
|
65
|
+
]);
|
|
66
|
+
componentDeclarations.push(componentDeclaration);
|
|
67
|
+
componentNode.value = t.identifier(componentName);
|
|
68
|
+
}
|
|
69
|
+
if (lazyComponentName || componentName) {
|
|
70
|
+
componentId++;
|
|
71
|
+
if (componentName) {
|
|
72
|
+
const upperFirstName = componentName.slice(0, 1).toUpperCase() + componentName.slice(1);
|
|
73
|
+
const jsxElement = t.jsxElement(t.jsxOpeningElement(t.jsxIdentifier(upperFirstName), [], true), null, [], true);
|
|
74
|
+
path.node.properties.push(t.objectProperty(t.identifier("element"), jsxElement));
|
|
75
|
+
} else {
|
|
76
|
+
path.node.properties.push(t.objectProperty(t.identifier("Component"), t.callExpression(t.identifier("lazy"), [
|
|
77
|
+
t.identifier(lazyComponentName)
|
|
78
|
+
])));
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
});
|
|
83
|
+
traverse(ast, {
|
|
84
|
+
Program(path) {
|
|
85
|
+
const lastImportIndex = path.get("body").reduce((lastIndex, p, index) => {
|
|
86
|
+
if (t.isImportDeclaration(p.node)) {
|
|
87
|
+
lastIndex = index;
|
|
88
|
+
}
|
|
89
|
+
return lastIndex;
|
|
90
|
+
}, -1);
|
|
91
|
+
if (lastImportIndex >= 0) {
|
|
92
|
+
const lastImport = path.get(`body.${lastImportIndex}`);
|
|
93
|
+
[
|
|
94
|
+
...componentDeclarations,
|
|
95
|
+
...lazyComponentDeclarations
|
|
96
|
+
].forEach((declaration) => {
|
|
97
|
+
if ("insertAfter" in lastImport) {
|
|
98
|
+
lastImport.insertAfter(declaration);
|
|
99
|
+
}
|
|
100
|
+
});
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
});
|
|
104
|
+
const { code } = generate(ast);
|
|
105
|
+
fs.writeFileSync(filePath, code);
|
|
106
|
+
}
|
|
107
|
+
export {
|
|
108
|
+
generateRoutes
|
|
109
|
+
};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
function clearMFCache() {
|
|
2
|
+
if (!globalThis.__FEDERATION__) {
|
|
3
|
+
console.log("clearMFCache no globalThis.__FEDERATION__");
|
|
4
|
+
return;
|
|
5
|
+
}
|
|
6
|
+
globalThis.__FEDERATION__.__INSTANCES__.map((i) => {
|
|
7
|
+
i.moduleCache.forEach((mc) => {
|
|
8
|
+
if (mc.remoteInfo && mc.remoteInfo.entryGlobalName) {
|
|
9
|
+
delete globalThis[mc.remoteInfo.entryGlobalName];
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
i.moduleCache.clear();
|
|
13
|
+
if (globalThis[i.name]) {
|
|
14
|
+
delete globalThis[i.name];
|
|
15
|
+
}
|
|
16
|
+
});
|
|
17
|
+
Object.keys(globalThis.__FEDERATION__).forEach((key) => {
|
|
18
|
+
if (Array.isArray(globalThis.__FEDERATION__[key])) {
|
|
19
|
+
globalThis.__FEDERATION__[key] = [];
|
|
20
|
+
} else if (key === "__PRELOADED_MAP__") {
|
|
21
|
+
globalThis.__FEDERATION__[key] = /* @__PURE__ */ new Map();
|
|
22
|
+
} else if (typeof globalThis.__FEDERATION__[key] === "object") {
|
|
23
|
+
globalThis.__FEDERATION__[key] = {};
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
if (globalThis.__GLOBAL_LOADING_REMOTE_ENTRY__) {
|
|
27
|
+
globalThis.__GLOBAL_LOADING_REMOTE_ENTRY__ = {};
|
|
28
|
+
}
|
|
29
|
+
globalThis.FORCE_MF_REFRESH = true;
|
|
30
|
+
}
|
|
31
|
+
export {
|
|
32
|
+
clearMFCache
|
|
33
|
+
};
|