@module-federation/bridge-react 0.0.0-next-20250701091154 → 0.0.0-next-20250701093604
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/CHANGELOG.md +6 -10
- package/__tests__/bridge.spec.tsx +7 -7
- package/dist/{bridge-base-P6pEjY1q.js → bridge-base-BoshEggF.mjs} +1 -1
- package/dist/{bridge-base-BBH982Tz.cjs → bridge-base-UGCwcMnG.js} +1 -1
- package/dist/data-fetch-runtime-plugin.cjs.js +73 -0
- package/dist/data-fetch-runtime-plugin.d.ts +6 -0
- package/dist/data-fetch-runtime-plugin.es.js +74 -0
- package/dist/data-fetch-server-middleware.cjs.js +163 -0
- package/dist/data-fetch-server-middleware.d.ts +6 -0
- package/dist/data-fetch-server-middleware.es.js +164 -0
- package/dist/data-fetch-utils.cjs.js +1271 -0
- package/dist/data-fetch-utils.d.ts +77 -0
- package/dist/data-fetch-utils.es.js +1273 -0
- package/dist/index-C0fDZB5b.js +45 -0
- package/dist/index-CqxytsLY.mjs +46 -0
- package/dist/index.cjs.js +434 -9
- package/dist/index.d.ts +142 -0
- package/dist/index.es.js +437 -11
- package/dist/index.esm-BCeUd-x9.mjs +418 -0
- package/dist/index.esm-j_1sIRzg.js +417 -0
- package/dist/inject-data-fetch-CAvi-gSf.js +79 -0
- package/dist/inject-data-fetch-errCdqBS.mjs +80 -0
- package/dist/lazy-utils.cjs.js +24 -0
- package/dist/lazy-utils.d.ts +140 -0
- package/dist/lazy-utils.es.js +24 -0
- package/dist/router-v5.cjs.js +1 -1
- package/dist/router-v5.es.js +1 -1
- package/dist/router-v6.cjs.js +1 -1
- package/dist/router-v6.es.js +1 -1
- package/dist/router.cjs.js +1 -1
- package/dist/router.es.js +1 -1
- package/dist/utils-Bk8hGjjF.mjs +2016 -0
- package/dist/utils-iEVlDmyk.js +2015 -0
- package/dist/v18.cjs.js +1 -1
- package/dist/v18.es.js +1 -1
- package/dist/v19.cjs.js +1 -1
- package/dist/v19.es.js +1 -1
- package/package.json +45 -5
- package/src/index.ts +30 -1
- package/src/lazy/AwaitDataFetch.tsx +176 -0
- package/src/lazy/constant.ts +30 -0
- package/src/lazy/createLazyComponent.tsx +393 -0
- package/src/lazy/data-fetch/cache.ts +296 -0
- package/src/lazy/data-fetch/call-data-fetch.ts +13 -0
- package/src/lazy/data-fetch/data-fetch-server-middleware.ts +196 -0
- package/src/lazy/data-fetch/index.ts +15 -0
- package/src/lazy/data-fetch/inject-data-fetch.ts +109 -0
- package/src/lazy/data-fetch/prefetch.ts +102 -0
- package/src/lazy/data-fetch/runtime-plugin.ts +116 -0
- package/src/lazy/index.ts +31 -0
- package/src/lazy/logger.ts +6 -0
- package/src/lazy/types.ts +75 -0
- package/src/lazy/utils.ts +372 -0
- package/src/lazy/wrapNoSSR.tsx +10 -0
- package/src/remote/component.tsx +3 -3
- package/src/remote/create.tsx +17 -4
- package/tsconfig.json +1 -1
- package/vite.config.ts +13 -0
- package/dist/index-Cv3p6r66.cjs +0 -235
- package/dist/index-D4yt7Udv.js +0 -236
package/dist/index.d.ts
CHANGED
|
@@ -1,11 +1,97 @@
|
|
|
1
1
|
import { default as default_2 } from 'react';
|
|
2
|
+
import { FederationRuntimePlugin } from '@module-federation/runtime';
|
|
3
|
+
import { getInstance } from '@module-federation/runtime';
|
|
4
|
+
import { JSX as JSX_2 } from 'react';
|
|
5
|
+
import { Key } from 'react';
|
|
2
6
|
import * as React_2 from 'react';
|
|
7
|
+
import { ReactNode } from 'react';
|
|
8
|
+
|
|
9
|
+
export declare const autoFetchDataPlugin: () => FederationRuntimePlugin;
|
|
10
|
+
|
|
11
|
+
export declare function cache<T>(fn: DataFetch<T>, options?: CacheOptions): DataFetch<T>;
|
|
12
|
+
|
|
13
|
+
declare interface CacheConfig {
|
|
14
|
+
maxSize?: number;
|
|
15
|
+
unstable_shouldDisable?: ({ request, }: {
|
|
16
|
+
request: Request;
|
|
17
|
+
}) => boolean | Promise<boolean>;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
declare interface CacheOptions {
|
|
21
|
+
tag?: string | string[];
|
|
22
|
+
maxAge?: number;
|
|
23
|
+
revalidate?: number;
|
|
24
|
+
getKey?: <Args extends any[]>(...args: Args) => string;
|
|
25
|
+
customKey?: <Args extends any[]>(options: {
|
|
26
|
+
params: Args;
|
|
27
|
+
fn: (...args: Args) => any;
|
|
28
|
+
generatedKey: string;
|
|
29
|
+
}) => string | symbol;
|
|
30
|
+
onCache?: (info: CacheStatsInfo) => boolean;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
export declare const CacheSize: {
|
|
34
|
+
readonly KB: 1024;
|
|
35
|
+
readonly MB: number;
|
|
36
|
+
readonly GB: number;
|
|
37
|
+
};
|
|
38
|
+
|
|
39
|
+
export declare interface CacheStatsInfo {
|
|
40
|
+
status: CacheStatus;
|
|
41
|
+
key: string | symbol;
|
|
42
|
+
params: DataFetchParams;
|
|
43
|
+
result: any;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
export declare type CacheStatus = 'hit' | 'stale' | 'miss';
|
|
47
|
+
|
|
48
|
+
export declare const CacheTime: {
|
|
49
|
+
readonly SECOND: 1000;
|
|
50
|
+
readonly MINUTE: number;
|
|
51
|
+
readonly HOUR: number;
|
|
52
|
+
readonly DAY: number;
|
|
53
|
+
readonly WEEK: number;
|
|
54
|
+
readonly MONTH: number;
|
|
55
|
+
};
|
|
56
|
+
|
|
57
|
+
export declare function callDataFetch(): Promise<void>;
|
|
58
|
+
|
|
59
|
+
export declare function clearStore(): void;
|
|
60
|
+
|
|
61
|
+
export declare function collectSSRAssets(options: CollectSSRAssetsOptions): default_2.ReactNode[];
|
|
62
|
+
|
|
63
|
+
export declare type CollectSSRAssetsOptions = {
|
|
64
|
+
id: string;
|
|
65
|
+
instance: ReturnType<typeof getInstance>;
|
|
66
|
+
injectScript?: boolean;
|
|
67
|
+
injectLink?: boolean;
|
|
68
|
+
};
|
|
69
|
+
|
|
70
|
+
export declare function configureCache(config: CacheConfig): void;
|
|
3
71
|
|
|
4
72
|
export declare function createBridgeComponent<T = any>(bridgeInfo: Omit<ProviderFnParams<T>, 'createRoot'>): () => {
|
|
5
73
|
render(info: RenderParams): Promise<void>;
|
|
6
74
|
destroy(info: DestroyParams): void;
|
|
7
75
|
};
|
|
8
76
|
|
|
77
|
+
export declare function createLazyComponent<T, E extends keyof T>(options: CreateLazyComponentOptions<T, E>): (props: T[E] extends (...args: any) => any ? Parameters<T[E]>[0] extends undefined ? ReactKey : Parameters<T[E]>[0] & ReactKey : ReactKey) => default_2.JSX.Element;
|
|
78
|
+
|
|
79
|
+
export declare type CreateLazyComponentOptions<T, E extends keyof T> = {
|
|
80
|
+
loader: () => Promise<T>;
|
|
81
|
+
instance: ReturnType<typeof getInstance>;
|
|
82
|
+
loading: default_2.ReactNode;
|
|
83
|
+
fallback: ReactNode | ((errorInfo: ErrorInfo) => ReactNode);
|
|
84
|
+
export?: E;
|
|
85
|
+
dataFetchParams?: DataFetchParams;
|
|
86
|
+
noSSR?: boolean;
|
|
87
|
+
cacheData?: boolean;
|
|
88
|
+
};
|
|
89
|
+
|
|
90
|
+
export declare function createRemoteAppComponent<T = Record<string, unknown>, E extends keyof T = keyof T>(info: LazyRemoteComponentInfo<T, E>): default_2.ForwardRefExoticComponent<Omit<RemoteComponentProps<Record<string, unknown>>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;
|
|
91
|
+
|
|
92
|
+
/**
|
|
93
|
+
* @deprecated createRemoteAppComponent is deprecated, please use createRemoteAppComponent instead!
|
|
94
|
+
*/
|
|
9
95
|
export declare function createRemoteComponent<T = Record<string, unknown>, E extends keyof T = keyof T>(info: LazyRemoteComponentInfo<T, E>): default_2.ForwardRefExoticComponent<Omit<RemoteComponentProps<Record<string, unknown>>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;
|
|
10
96
|
|
|
11
97
|
export declare interface CreateRootOptions {
|
|
@@ -22,6 +108,13 @@ declare interface CreateRootOptions_2 {
|
|
|
22
108
|
transitionCallbacks?: unknown;
|
|
23
109
|
}
|
|
24
110
|
|
|
111
|
+
declare type DataFetch<T> = (params: DataFetchParams) => Promise<T>;
|
|
112
|
+
|
|
113
|
+
export declare type DataFetchParams = {
|
|
114
|
+
isDowngrade: boolean;
|
|
115
|
+
_id?: string;
|
|
116
|
+
} & Record<string, unknown>;
|
|
117
|
+
|
|
25
118
|
/**
|
|
26
119
|
* Parameters for the destroy function
|
|
27
120
|
*/
|
|
@@ -30,8 +123,39 @@ export declare interface DestroyParams {
|
|
|
30
123
|
dom: HTMLElement;
|
|
31
124
|
}
|
|
32
125
|
|
|
126
|
+
export declare const ERROR_TYPE: {
|
|
127
|
+
DATA_FETCH: number;
|
|
128
|
+
LOAD_REMOTE: number;
|
|
129
|
+
UNKNOWN: number;
|
|
130
|
+
};
|
|
131
|
+
|
|
132
|
+
declare type ErrorInfo = {
|
|
133
|
+
error: Error;
|
|
134
|
+
errorType: number;
|
|
135
|
+
dataFetchMapKey?: string;
|
|
136
|
+
};
|
|
137
|
+
|
|
138
|
+
export declare function generateKey(dataFetchOptions: DataFetchParams): string;
|
|
139
|
+
|
|
33
140
|
declare type LazyRemoteComponentInfo<T, E extends keyof T> = RemoteComponentParams<T>;
|
|
34
141
|
|
|
142
|
+
export declare type NoSSRRemoteInfo = {
|
|
143
|
+
name: string;
|
|
144
|
+
version: string;
|
|
145
|
+
ssrPublicPath: string;
|
|
146
|
+
ssrRemoteEntry: string;
|
|
147
|
+
globalName: string;
|
|
148
|
+
};
|
|
149
|
+
|
|
150
|
+
export declare function prefetch(options: PrefetchOptions): Promise<void>;
|
|
151
|
+
|
|
152
|
+
declare type PrefetchOptions = {
|
|
153
|
+
id: string;
|
|
154
|
+
instance: ReturnType<typeof getInstance>;
|
|
155
|
+
dataFetchParams?: DataFetchParams;
|
|
156
|
+
preloadComponentResource?: boolean;
|
|
157
|
+
};
|
|
158
|
+
|
|
35
159
|
/**
|
|
36
160
|
* Parameters for the provider function
|
|
37
161
|
*/
|
|
@@ -65,6 +189,10 @@ export declare interface ProviderParams {
|
|
|
65
189
|
className?: string;
|
|
66
190
|
}
|
|
67
191
|
|
|
192
|
+
declare type ReactKey = {
|
|
193
|
+
key?: default_2.Key | null;
|
|
194
|
+
};
|
|
195
|
+
|
|
68
196
|
/**
|
|
69
197
|
* Parameters for the remote component loader
|
|
70
198
|
*/
|
|
@@ -113,6 +241,8 @@ export declare interface RenderParams {
|
|
|
113
241
|
[key: string]: unknown;
|
|
114
242
|
}
|
|
115
243
|
|
|
244
|
+
export declare function revalidateTag(tag: string): void;
|
|
245
|
+
|
|
116
246
|
export declare interface Root {
|
|
117
247
|
render(children: React.ReactNode): void;
|
|
118
248
|
unmount(): void;
|
|
@@ -131,4 +261,16 @@ declare interface Root_2 {
|
|
|
131
261
|
*/
|
|
132
262
|
export declare type RootType = HTMLElement | Root_2;
|
|
133
263
|
|
|
264
|
+
export declare function setSSREnv({ fetchServerQuery, }: {
|
|
265
|
+
fetchServerQuery?: Record<string, unknown>;
|
|
266
|
+
}): void;
|
|
267
|
+
|
|
268
|
+
export declare function wrapNoSSR<T, E extends keyof T>(createLazyComponentFn: typeof createLazyComponent<T, E>): (options: Omit<CreateLazyComponentOptions<T, E>, "noSSR">) => (props: T[E] extends (...args: any) => any ? Parameters<T[E]>[0] extends undefined ? {
|
|
269
|
+
key?: Key | null;
|
|
270
|
+
} : Parameters<T[E]>[0] & {
|
|
271
|
+
key?: Key | null;
|
|
272
|
+
} : {
|
|
273
|
+
key?: Key | null;
|
|
274
|
+
}) => JSX_2.Element;
|
|
275
|
+
|
|
134
276
|
export { }
|
package/dist/index.es.js
CHANGED
|
@@ -1,9 +1,13 @@
|
|
|
1
|
-
import { c as createBaseBridgeComponent, E as ErrorBoundary } from "./bridge-base-
|
|
1
|
+
import { c as createBaseBridgeComponent, E as ErrorBoundary } from "./bridge-base-BoshEggF.mjs";
|
|
2
2
|
import ReactDOM from "react-dom";
|
|
3
|
-
import React__default, { forwardRef, useRef, useState, useEffect, useContext } from "react";
|
|
4
|
-
import { L as LoggerInstance, g as getRootDomDefaultClassName, p as pathJoin } from "./index-
|
|
3
|
+
import React__default, { forwardRef, useRef, useState, useEffect, useContext, Suspense } from "react";
|
|
4
|
+
import { L as LoggerInstance, g as getRootDomDefaultClassName, p as pathJoin } from "./index-CqxytsLY.mjs";
|
|
5
5
|
import * as ReactRouterDOM from "react-router-dom";
|
|
6
6
|
import { federationRuntime } from "./plugin.es.js";
|
|
7
|
+
import { default as default2 } from "./data-fetch-runtime-plugin.es.js";
|
|
8
|
+
import { s as getDataFetchIdWithErrorMsgs, t as DATA_FETCH_ERROR_PREFIX, E as ERROR_TYPE, w as wrapDataFetchId, L as LOAD_REMOTE_ERROR_PREFIX, l as logger, n as DATA_FETCH_FUNCTION, u as getLoadedRemoteInfos, a as getDataFetchMapKey, g as getDataFetchInfo, m as fetchData$1, v as setDataFetchItemLoadedStatus, F as FS_HREF, b as getDataFetchItem, M as MF_DATA_FETCH_TYPE } from "./utils-Bk8hGjjF.mjs";
|
|
9
|
+
import { C, y, B, H, z, A, G, x } from "./utils-Bk8hGjjF.mjs";
|
|
10
|
+
import { callDataFetch, prefetch } from "./data-fetch-utils.es.js";
|
|
7
11
|
function createReact16Or17Root(container) {
|
|
8
12
|
return {
|
|
9
13
|
render(children) {
|
|
@@ -64,7 +68,7 @@ const RemoteAppWrapper = forwardRef(function(props, ref) {
|
|
|
64
68
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
65
69
|
if ((_a = providerInfoRef.current) == null ? void 0 : _a.destroy) {
|
|
66
70
|
LoggerInstance.debug(
|
|
67
|
-
`
|
|
71
|
+
`createRemoteAppComponent LazyComponent destroy >>>`,
|
|
68
72
|
{ moduleName, basename, dom: renderDom.current }
|
|
69
73
|
);
|
|
70
74
|
(_d = (_c = (_b = instance == null ? void 0 : instance.bridgeHook) == null ? void 0 : _b.lifecycle) == null ? void 0 : _c.beforeBridgeDestroy) == null ? void 0 : _d.emit({
|
|
@@ -152,7 +156,7 @@ function withRouterData(WrappedComponent) {
|
|
|
152
156
|
}
|
|
153
157
|
}
|
|
154
158
|
}
|
|
155
|
-
LoggerInstance.debug(`
|
|
159
|
+
LoggerInstance.debug(`createRemoteAppComponent withRouterData >>>`, {
|
|
156
160
|
...props,
|
|
157
161
|
basename,
|
|
158
162
|
routerContextVal,
|
|
@@ -164,7 +168,7 @@ function withRouterData(WrappedComponent) {
|
|
|
164
168
|
useEffect(() => {
|
|
165
169
|
if (pathname !== "" && pathname !== location.pathname) {
|
|
166
170
|
LoggerInstance.debug(
|
|
167
|
-
`
|
|
171
|
+
`createRemoteAppComponent dispatchPopstateEnv >>>`,
|
|
168
172
|
{
|
|
169
173
|
name: props.name,
|
|
170
174
|
pathname: location.pathname
|
|
@@ -185,7 +189,7 @@ const RemoteApp = withRouterData(RemoteAppWrapper);
|
|
|
185
189
|
function createLazyRemoteComponent(info) {
|
|
186
190
|
const exportName = (info == null ? void 0 : info.export) || "default";
|
|
187
191
|
return React__default.lazy(async () => {
|
|
188
|
-
LoggerInstance.debug(`
|
|
192
|
+
LoggerInstance.debug(`createRemoteAppComponent LazyComponent create >>>`, {
|
|
189
193
|
lazyComponent: info.loader,
|
|
190
194
|
exportName
|
|
191
195
|
});
|
|
@@ -193,7 +197,7 @@ function createLazyRemoteComponent(info) {
|
|
|
193
197
|
const m = await info.loader();
|
|
194
198
|
const moduleName = m && m[Symbol.for("mf_module_id")];
|
|
195
199
|
LoggerInstance.debug(
|
|
196
|
-
`
|
|
200
|
+
`createRemoteAppComponent LazyComponent loadRemote info >>>`,
|
|
197
201
|
{ name: moduleName, module: m, exportName }
|
|
198
202
|
);
|
|
199
203
|
const exportFn = m[exportName];
|
|
@@ -216,7 +220,7 @@ function createLazyRemoteComponent(info) {
|
|
|
216
220
|
};
|
|
217
221
|
} else {
|
|
218
222
|
LoggerInstance.debug(
|
|
219
|
-
`
|
|
223
|
+
`createRemoteAppComponent LazyComponent module not found >>>`,
|
|
220
224
|
{ name: moduleName, module: m, exportName }
|
|
221
225
|
);
|
|
222
226
|
throw Error(
|
|
@@ -230,7 +234,7 @@ function createLazyRemoteComponent(info) {
|
|
|
230
234
|
}
|
|
231
235
|
});
|
|
232
236
|
}
|
|
233
|
-
function
|
|
237
|
+
function createRemoteAppComponent(info) {
|
|
234
238
|
const LazyComponent = createLazyRemoteComponent(info);
|
|
235
239
|
return forwardRef((props, ref) => {
|
|
236
240
|
return /* @__PURE__ */ React__default.createElement(
|
|
@@ -242,7 +246,429 @@ function createRemoteComponent(info) {
|
|
|
242
246
|
);
|
|
243
247
|
});
|
|
244
248
|
}
|
|
249
|
+
function createRemoteComponent(info) {
|
|
250
|
+
LoggerInstance.warn(
|
|
251
|
+
`createRemoteAppComponent is deprecated, please use createRemoteAppComponent instead!`
|
|
252
|
+
);
|
|
253
|
+
return createRemoteAppComponent(info);
|
|
254
|
+
}
|
|
255
|
+
function isPromise(obj) {
|
|
256
|
+
return !!obj && (typeof obj === "object" || typeof obj === "function") && typeof obj.then === "function";
|
|
257
|
+
}
|
|
258
|
+
const AWAIT_ERROR_PREFIX = "<Await /> caught the following error during render: ";
|
|
259
|
+
const transformError = (err) => {
|
|
260
|
+
const errMsg = err instanceof Error ? err.message : err;
|
|
261
|
+
const originalMsg = errMsg.replace(AWAIT_ERROR_PREFIX, "");
|
|
262
|
+
const dataFetchMapKey = getDataFetchIdWithErrorMsgs(originalMsg);
|
|
263
|
+
if (originalMsg.indexOf(DATA_FETCH_ERROR_PREFIX) === 0) {
|
|
264
|
+
return {
|
|
265
|
+
error: new Error(
|
|
266
|
+
originalMsg.replace(DATA_FETCH_ERROR_PREFIX, "").replace(wrapDataFetchId(dataFetchMapKey), "")
|
|
267
|
+
),
|
|
268
|
+
errorType: ERROR_TYPE.DATA_FETCH,
|
|
269
|
+
dataFetchMapKey
|
|
270
|
+
};
|
|
271
|
+
}
|
|
272
|
+
if (originalMsg.indexOf(LOAD_REMOTE_ERROR_PREFIX) === 0) {
|
|
273
|
+
return {
|
|
274
|
+
error: new Error(
|
|
275
|
+
originalMsg.replace(LOAD_REMOTE_ERROR_PREFIX, "").replace(wrapDataFetchId(dataFetchMapKey), "")
|
|
276
|
+
),
|
|
277
|
+
errorType: ERROR_TYPE.LOAD_REMOTE,
|
|
278
|
+
dataFetchMapKey
|
|
279
|
+
};
|
|
280
|
+
}
|
|
281
|
+
return {
|
|
282
|
+
error: new Error(originalMsg.replace(wrapDataFetchId(dataFetchMapKey), "")),
|
|
283
|
+
errorType: ERROR_TYPE.UNKNOWN,
|
|
284
|
+
dataFetchMapKey
|
|
285
|
+
};
|
|
286
|
+
};
|
|
287
|
+
const DefaultLoading = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null);
|
|
288
|
+
const DefaultErrorElement = (_data) => /* @__PURE__ */ React__default.createElement("div", null, "Error");
|
|
289
|
+
function AwaitDataFetch({
|
|
290
|
+
resolve,
|
|
291
|
+
loading = DefaultLoading,
|
|
292
|
+
errorElement = DefaultErrorElement,
|
|
293
|
+
children,
|
|
294
|
+
params
|
|
295
|
+
}) {
|
|
296
|
+
const dataRef = useRef();
|
|
297
|
+
const data = dataRef.current || resolve;
|
|
298
|
+
const getData = isPromise(data) ? fetchData(data, dataRef) : () => data;
|
|
299
|
+
return /* @__PURE__ */ React__default.createElement(
|
|
300
|
+
AwaitSuspense,
|
|
301
|
+
{
|
|
302
|
+
params,
|
|
303
|
+
loading,
|
|
304
|
+
errorElement,
|
|
305
|
+
resolve: getData
|
|
306
|
+
},
|
|
307
|
+
children
|
|
308
|
+
);
|
|
309
|
+
}
|
|
310
|
+
function AwaitSuspense({
|
|
311
|
+
resolve,
|
|
312
|
+
children,
|
|
313
|
+
loading = DefaultLoading,
|
|
314
|
+
errorElement = DefaultErrorElement
|
|
315
|
+
}) {
|
|
316
|
+
return /* @__PURE__ */ React__default.createElement(Suspense, { fallback: loading }, /* @__PURE__ */ React__default.createElement(ResolveAwait, { resolve, errorElement }, children));
|
|
317
|
+
}
|
|
318
|
+
function ResolveAwait({
|
|
319
|
+
children,
|
|
320
|
+
resolve,
|
|
321
|
+
errorElement,
|
|
322
|
+
params
|
|
323
|
+
}) {
|
|
324
|
+
const data = resolve();
|
|
325
|
+
logger.debug("resolve data: ", data);
|
|
326
|
+
if (typeof data === "string" && data.indexOf(AWAIT_ERROR_PREFIX) === 0) {
|
|
327
|
+
const transformedError = transformError(data);
|
|
328
|
+
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, typeof errorElement === "function" ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, globalThis.FEDERATION_SSR && /* @__PURE__ */ React__default.createElement(
|
|
329
|
+
"script",
|
|
330
|
+
{
|
|
331
|
+
suppressHydrationWarning: true,
|
|
332
|
+
dangerouslySetInnerHTML: {
|
|
333
|
+
__html: String.raw`
|
|
334
|
+
globalThis['${DATA_FETCH_FUNCTION}'] = globalThis['${DATA_FETCH_FUNCTION}'] || []
|
|
335
|
+
globalThis['${DATA_FETCH_FUNCTION}'].push([${transformedError.dataFetchMapKey ? `'${transformedError.dataFetchMapKey}'` : ""},${params ? JSON.stringify(params) : null},true]);`
|
|
336
|
+
}
|
|
337
|
+
}
|
|
338
|
+
), errorElement(transformedError)) : errorElement);
|
|
339
|
+
}
|
|
340
|
+
const toRender = typeof children === "function" ? children(data) : children;
|
|
341
|
+
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, toRender);
|
|
342
|
+
}
|
|
343
|
+
const fetchData = (promise, ref) => {
|
|
344
|
+
let data;
|
|
345
|
+
let status = "pending";
|
|
346
|
+
const suspender = promise.then((res) => {
|
|
347
|
+
status = "success";
|
|
348
|
+
data = res;
|
|
349
|
+
ref.current = res;
|
|
350
|
+
}).catch((e2) => {
|
|
351
|
+
status = "success";
|
|
352
|
+
console.warn(e2);
|
|
353
|
+
data = AWAIT_ERROR_PREFIX + e2;
|
|
354
|
+
});
|
|
355
|
+
return () => {
|
|
356
|
+
if (status === "pending") {
|
|
357
|
+
throw suspender;
|
|
358
|
+
}
|
|
359
|
+
return data;
|
|
360
|
+
};
|
|
361
|
+
};
|
|
362
|
+
function getTargetModuleInfo(id, instance) {
|
|
363
|
+
if (!instance) {
|
|
364
|
+
return;
|
|
365
|
+
}
|
|
366
|
+
const loadedRemoteInfo = getLoadedRemoteInfos(id, instance);
|
|
367
|
+
if (!loadedRemoteInfo) {
|
|
368
|
+
return;
|
|
369
|
+
}
|
|
370
|
+
const snapshot = loadedRemoteInfo.snapshot;
|
|
371
|
+
if (!snapshot) {
|
|
372
|
+
return;
|
|
373
|
+
}
|
|
374
|
+
const publicPath = "publicPath" in snapshot ? snapshot.publicPath : "getPublicPath" in snapshot ? new Function(snapshot.getPublicPath)() : "";
|
|
375
|
+
if (!publicPath) {
|
|
376
|
+
return;
|
|
377
|
+
}
|
|
378
|
+
const modules = "modules" in snapshot ? snapshot.modules : [];
|
|
379
|
+
const targetModule = modules.find(
|
|
380
|
+
(m) => m.modulePath === loadedRemoteInfo.expose
|
|
381
|
+
);
|
|
382
|
+
if (!targetModule) {
|
|
383
|
+
return;
|
|
384
|
+
}
|
|
385
|
+
const remoteEntry = "remoteEntry" in snapshot ? snapshot.remoteEntry : "";
|
|
386
|
+
if (!remoteEntry) {
|
|
387
|
+
return;
|
|
388
|
+
}
|
|
389
|
+
return {
|
|
390
|
+
module: targetModule,
|
|
391
|
+
publicPath,
|
|
392
|
+
remoteEntry
|
|
393
|
+
};
|
|
394
|
+
}
|
|
395
|
+
function collectSSRAssets(options) {
|
|
396
|
+
const {
|
|
397
|
+
id,
|
|
398
|
+
injectLink = true,
|
|
399
|
+
injectScript = false
|
|
400
|
+
} = typeof options === "string" ? { id: options } : options;
|
|
401
|
+
const links = [];
|
|
402
|
+
const scripts = [];
|
|
403
|
+
const instance = options.instance;
|
|
404
|
+
if (!instance || !injectLink && !injectScript) {
|
|
405
|
+
return [...scripts, ...links];
|
|
406
|
+
}
|
|
407
|
+
const moduleAndPublicPath = getTargetModuleInfo(id, instance);
|
|
408
|
+
if (!moduleAndPublicPath) {
|
|
409
|
+
return [...scripts, ...links];
|
|
410
|
+
}
|
|
411
|
+
const { module: targetModule, publicPath, remoteEntry } = moduleAndPublicPath;
|
|
412
|
+
if (injectLink) {
|
|
413
|
+
[...targetModule.assets.css.sync, ...targetModule.assets.css.async].sort().forEach((file, index) => {
|
|
414
|
+
links.push(
|
|
415
|
+
/* @__PURE__ */ React__default.createElement(
|
|
416
|
+
"link",
|
|
417
|
+
{
|
|
418
|
+
key: `${file.split(".")[0]}_${index}`,
|
|
419
|
+
href: `${publicPath}${file}`,
|
|
420
|
+
rel: "stylesheet",
|
|
421
|
+
type: "text/css"
|
|
422
|
+
}
|
|
423
|
+
)
|
|
424
|
+
);
|
|
425
|
+
});
|
|
426
|
+
}
|
|
427
|
+
if (injectScript) {
|
|
428
|
+
scripts.push(
|
|
429
|
+
/* @__PURE__ */ React__default.createElement(
|
|
430
|
+
"script",
|
|
431
|
+
{
|
|
432
|
+
async: true,
|
|
433
|
+
key: remoteEntry.split(".")[0],
|
|
434
|
+
src: `${publicPath}${remoteEntry}`,
|
|
435
|
+
crossOrigin: "anonymous"
|
|
436
|
+
}
|
|
437
|
+
)
|
|
438
|
+
);
|
|
439
|
+
[...targetModule.assets.js.sync].sort().forEach((file, index) => {
|
|
440
|
+
scripts.push(
|
|
441
|
+
/* @__PURE__ */ React__default.createElement(
|
|
442
|
+
"script",
|
|
443
|
+
{
|
|
444
|
+
key: `${file.split(".")[0]}_${index}`,
|
|
445
|
+
async: true,
|
|
446
|
+
src: `${publicPath}${file}`,
|
|
447
|
+
crossOrigin: "anonymous"
|
|
448
|
+
}
|
|
449
|
+
)
|
|
450
|
+
);
|
|
451
|
+
});
|
|
452
|
+
}
|
|
453
|
+
return [...scripts, ...links];
|
|
454
|
+
}
|
|
455
|
+
function getServerNeedRemoteInfo(loadedRemoteInfo, id, noSSR) {
|
|
456
|
+
var _a;
|
|
457
|
+
if (noSSR || typeof window !== "undefined" && window.location.href !== window[FS_HREF]) {
|
|
458
|
+
if (!(loadedRemoteInfo == null ? void 0 : loadedRemoteInfo.version)) {
|
|
459
|
+
throw new Error(`${loadedRemoteInfo == null ? void 0 : loadedRemoteInfo.name} version is empty`);
|
|
460
|
+
}
|
|
461
|
+
const { snapshot } = loadedRemoteInfo;
|
|
462
|
+
if (!snapshot) {
|
|
463
|
+
throw new Error(`${loadedRemoteInfo == null ? void 0 : loadedRemoteInfo.name} snapshot is empty`);
|
|
464
|
+
}
|
|
465
|
+
const dataFetchItem = getDataFetchItem(id);
|
|
466
|
+
const isFetchServer = ((_a = dataFetchItem == null ? void 0 : dataFetchItem[0]) == null ? void 0 : _a[1]) === MF_DATA_FETCH_TYPE.FETCH_SERVER;
|
|
467
|
+
if (isFetchServer && (!("ssrPublicPath" in snapshot) || !snapshot.ssrPublicPath)) {
|
|
468
|
+
throw new Error(
|
|
469
|
+
`ssrPublicPath is required while fetching ${loadedRemoteInfo == null ? void 0 : loadedRemoteInfo.name} data in SSR project!`
|
|
470
|
+
);
|
|
471
|
+
}
|
|
472
|
+
if (isFetchServer && (!("ssrRemoteEntry" in snapshot) || !snapshot.ssrRemoteEntry)) {
|
|
473
|
+
throw new Error(
|
|
474
|
+
`ssrRemoteEntry is required while loading ${loadedRemoteInfo == null ? void 0 : loadedRemoteInfo.name} data loader in SSR project!`
|
|
475
|
+
);
|
|
476
|
+
}
|
|
477
|
+
return {
|
|
478
|
+
name: loadedRemoteInfo.name,
|
|
479
|
+
version: loadedRemoteInfo.version,
|
|
480
|
+
ssrPublicPath: "ssrPublicPath" in snapshot ? snapshot.ssrPublicPath || "" : "",
|
|
481
|
+
ssrRemoteEntry: "ssrRemoteEntry" in snapshot ? snapshot.ssrRemoteEntry || "" : "",
|
|
482
|
+
globalName: loadedRemoteInfo.entryGlobalName
|
|
483
|
+
};
|
|
484
|
+
}
|
|
485
|
+
return void 0;
|
|
486
|
+
}
|
|
487
|
+
function createLazyComponent(options) {
|
|
488
|
+
const { instance, cacheData } = options;
|
|
489
|
+
if (!instance) {
|
|
490
|
+
throw new Error("instance is required for createLazyComponent!");
|
|
491
|
+
}
|
|
492
|
+
let dataCache = null;
|
|
493
|
+
const exportName = (options == null ? void 0 : options.export) || "default";
|
|
494
|
+
const callLoader = async () => {
|
|
495
|
+
logger.debug("callLoader start", Date.now());
|
|
496
|
+
const m = await options.loader();
|
|
497
|
+
logger.debug("callLoader end", Date.now());
|
|
498
|
+
if (!m) {
|
|
499
|
+
throw new Error("load remote failed");
|
|
500
|
+
}
|
|
501
|
+
return m;
|
|
502
|
+
};
|
|
503
|
+
const getData = async (noSSR) => {
|
|
504
|
+
let loadedRemoteInfo;
|
|
505
|
+
let moduleId;
|
|
506
|
+
try {
|
|
507
|
+
const m = await callLoader();
|
|
508
|
+
moduleId = m && m[Symbol.for("mf_module_id")];
|
|
509
|
+
if (!moduleId) {
|
|
510
|
+
throw new Error("moduleId is empty");
|
|
511
|
+
}
|
|
512
|
+
loadedRemoteInfo = getLoadedRemoteInfos(moduleId, instance);
|
|
513
|
+
if (!loadedRemoteInfo) {
|
|
514
|
+
throw new Error(`can not find loaded remote('${moduleId}') info!`);
|
|
515
|
+
}
|
|
516
|
+
} catch (e2) {
|
|
517
|
+
const errMsg = `${LOAD_REMOTE_ERROR_PREFIX}${e2}`;
|
|
518
|
+
logger.debug(e2);
|
|
519
|
+
throw new Error(errMsg);
|
|
520
|
+
}
|
|
521
|
+
let dataFetchMapKey;
|
|
522
|
+
try {
|
|
523
|
+
dataFetchMapKey = getDataFetchMapKey(
|
|
524
|
+
getDataFetchInfo({
|
|
525
|
+
name: loadedRemoteInfo.name,
|
|
526
|
+
alias: loadedRemoteInfo.alias,
|
|
527
|
+
id: moduleId,
|
|
528
|
+
remoteSnapshot: loadedRemoteInfo.snapshot
|
|
529
|
+
}),
|
|
530
|
+
{ name: instance.name, version: instance.options.version }
|
|
531
|
+
);
|
|
532
|
+
logger.debug("getData dataFetchMapKey: ", dataFetchMapKey);
|
|
533
|
+
if (!dataFetchMapKey) {
|
|
534
|
+
return;
|
|
535
|
+
}
|
|
536
|
+
const data = await fetchData$1(
|
|
537
|
+
dataFetchMapKey,
|
|
538
|
+
{
|
|
539
|
+
...options.dataFetchParams,
|
|
540
|
+
isDowngrade: false
|
|
541
|
+
},
|
|
542
|
+
getServerNeedRemoteInfo(loadedRemoteInfo, dataFetchMapKey, noSSR)
|
|
543
|
+
);
|
|
544
|
+
setDataFetchItemLoadedStatus(dataFetchMapKey);
|
|
545
|
+
logger.debug("get data res: \n", data);
|
|
546
|
+
dataCache = data;
|
|
547
|
+
return data;
|
|
548
|
+
} catch (err) {
|
|
549
|
+
const errMsg = `${DATA_FETCH_ERROR_PREFIX}${wrapDataFetchId(dataFetchMapKey)}${err}`;
|
|
550
|
+
logger.debug(errMsg);
|
|
551
|
+
throw new Error(errMsg);
|
|
552
|
+
}
|
|
553
|
+
};
|
|
554
|
+
const LazyComponent = React__default.lazy(async () => {
|
|
555
|
+
const m = await callLoader();
|
|
556
|
+
const moduleId = m && m[Symbol.for("mf_module_id")];
|
|
557
|
+
const loadedRemoteInfo = getLoadedRemoteInfos(moduleId, instance);
|
|
558
|
+
loadedRemoteInfo == null ? void 0 : loadedRemoteInfo.snapshot;
|
|
559
|
+
const dataFetchMapKey = loadedRemoteInfo ? getDataFetchMapKey(
|
|
560
|
+
getDataFetchInfo({
|
|
561
|
+
name: loadedRemoteInfo.name,
|
|
562
|
+
alias: loadedRemoteInfo.alias,
|
|
563
|
+
id: moduleId,
|
|
564
|
+
remoteSnapshot: loadedRemoteInfo.snapshot
|
|
565
|
+
}),
|
|
566
|
+
{ name: instance.name, version: instance == null ? void 0 : instance.options.version }
|
|
567
|
+
) : void 0;
|
|
568
|
+
logger.debug("LazyComponent dataFetchMapKey: ", dataFetchMapKey);
|
|
569
|
+
const assets = collectSSRAssets({
|
|
570
|
+
id: moduleId,
|
|
571
|
+
instance
|
|
572
|
+
});
|
|
573
|
+
const Com = m[exportName];
|
|
574
|
+
if (exportName in m && typeof Com === "function") {
|
|
575
|
+
return {
|
|
576
|
+
default: (props) => /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, globalThis.FEDERATION_SSR && dataFetchMapKey && /* @__PURE__ */ React__default.createElement(
|
|
577
|
+
"script",
|
|
578
|
+
{
|
|
579
|
+
suppressHydrationWarning: true,
|
|
580
|
+
dangerouslySetInnerHTML: {
|
|
581
|
+
__html: String.raw`
|
|
582
|
+
globalThis['${DATA_FETCH_FUNCTION}'] = globalThis['${DATA_FETCH_FUNCTION}'] || [];
|
|
583
|
+
globalThis['${DATA_FETCH_FUNCTION}'].push(['${dataFetchMapKey}',${JSON.stringify(props.mfData)}]);
|
|
584
|
+
`
|
|
585
|
+
}
|
|
586
|
+
}
|
|
587
|
+
), globalThis.FEDERATION_SSR && assets, /* @__PURE__ */ React__default.createElement(Com, { ...props }))
|
|
588
|
+
};
|
|
589
|
+
} else {
|
|
590
|
+
throw Error(
|
|
591
|
+
`Make sure that ${moduleId} has the correct export when export is ${String(
|
|
592
|
+
exportName
|
|
593
|
+
)}`
|
|
594
|
+
);
|
|
595
|
+
}
|
|
596
|
+
});
|
|
597
|
+
return (props) => {
|
|
598
|
+
const { key, ...args } = props;
|
|
599
|
+
if (cacheData && dataCache) {
|
|
600
|
+
return /* @__PURE__ */ React__default.createElement(LazyComponent, { ...args, mfData: dataCache });
|
|
601
|
+
}
|
|
602
|
+
if (!options.noSSR) {
|
|
603
|
+
return /* @__PURE__ */ React__default.createElement(
|
|
604
|
+
AwaitDataFetch,
|
|
605
|
+
{
|
|
606
|
+
resolve: getData(options.noSSR),
|
|
607
|
+
loading: options.loading,
|
|
608
|
+
errorElement: options.fallback
|
|
609
|
+
},
|
|
610
|
+
(data) => /* @__PURE__ */ React__default.createElement(LazyComponent, { ...args, mfData: data })
|
|
611
|
+
);
|
|
612
|
+
} else {
|
|
613
|
+
const [data, setData] = useState(null);
|
|
614
|
+
const [loading, setLoading] = useState(true);
|
|
615
|
+
const [error, setError] = useState(null);
|
|
616
|
+
useEffect(() => {
|
|
617
|
+
let isMounted = true;
|
|
618
|
+
const fetchDataAsync = async () => {
|
|
619
|
+
try {
|
|
620
|
+
setLoading(true);
|
|
621
|
+
const result = await getData(options.noSSR);
|
|
622
|
+
if (isMounted) {
|
|
623
|
+
setData(result);
|
|
624
|
+
}
|
|
625
|
+
} catch (e2) {
|
|
626
|
+
if (isMounted) {
|
|
627
|
+
setError(transformError(e2));
|
|
628
|
+
}
|
|
629
|
+
} finally {
|
|
630
|
+
if (isMounted) {
|
|
631
|
+
setLoading(false);
|
|
632
|
+
}
|
|
633
|
+
}
|
|
634
|
+
};
|
|
635
|
+
fetchDataAsync();
|
|
636
|
+
return () => {
|
|
637
|
+
isMounted = false;
|
|
638
|
+
};
|
|
639
|
+
}, []);
|
|
640
|
+
if (loading) {
|
|
641
|
+
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, options.loading);
|
|
642
|
+
}
|
|
643
|
+
if (error) {
|
|
644
|
+
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, typeof options.fallback === "function" ? options.fallback(error) : options.fallback);
|
|
645
|
+
}
|
|
646
|
+
return /* @__PURE__ */ React__default.createElement(LazyComponent, { ...args, mfData: data });
|
|
647
|
+
}
|
|
648
|
+
};
|
|
649
|
+
}
|
|
650
|
+
function wrapNoSSR(createLazyComponentFn) {
|
|
651
|
+
return (options) => {
|
|
652
|
+
return createLazyComponentFn({ ...options, noSSR: true });
|
|
653
|
+
};
|
|
654
|
+
}
|
|
245
655
|
export {
|
|
656
|
+
C as CacheSize,
|
|
657
|
+
y as CacheTime,
|
|
658
|
+
ERROR_TYPE,
|
|
659
|
+
default2 as autoFetchDataPlugin,
|
|
660
|
+
B as cache,
|
|
661
|
+
callDataFetch,
|
|
662
|
+
H as clearStore,
|
|
663
|
+
collectSSRAssets,
|
|
664
|
+
z as configureCache,
|
|
246
665
|
createBridgeComponent,
|
|
247
|
-
|
|
666
|
+
createLazyComponent,
|
|
667
|
+
createRemoteAppComponent,
|
|
668
|
+
createRemoteComponent,
|
|
669
|
+
A as generateKey,
|
|
670
|
+
prefetch,
|
|
671
|
+
G as revalidateTag,
|
|
672
|
+
x as setSSREnv,
|
|
673
|
+
wrapNoSSR
|
|
248
674
|
};
|