@umijs/plugins 4.0.65 → 4.0.67
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/antd.js +29 -10
- package/dist/constants.d.ts +1 -0
- package/dist/constants.js +30 -0
- package/dist/layout.js +10 -5
- package/dist/locale.js +6 -4
- package/dist/mf.js +3 -1
- package/dist/qiankun/slave.js +26 -12
- package/libs/qiankun/master/MicroApp.tsx +38 -43
- package/package.json +5 -4
- package/{tpls/antd-runtime.ts.tpl → templates/antd/runtime.ts.tpl} +33 -20
- /package/{libs → templates}/locale/SelectLang.tpl +0 -0
- /package/{libs → templates}/locale/locale.tpl +0 -0
- /package/{libs → templates}/locale/localeExports.tpl +0 -0
- /package/{libs → templates}/locale/runtime.tpl +0 -0
- /package/{tpls/mf-runtime.ts.tpl → templates/mf/runtime.ts.tpl} +0 -0
package/dist/antd.js
CHANGED
|
@@ -32,12 +32,15 @@ __export(antd_exports, {
|
|
|
32
32
|
default: () => antd_default
|
|
33
33
|
});
|
|
34
34
|
module.exports = __toCommonJS(antd_exports);
|
|
35
|
+
var import_moment_webpack_plugin = __toESM(require("@ant-design/moment-webpack-plugin"));
|
|
35
36
|
var import_assert = __toESM(require("assert"));
|
|
36
37
|
var import_path = require("path");
|
|
37
38
|
var import_umi = require("umi");
|
|
38
39
|
var import_plugin_utils = require("umi/plugin-utils");
|
|
40
|
+
var import_constants = require("./constants");
|
|
39
41
|
var import_resolveProjectDep = require("./utils/resolveProjectDep");
|
|
40
42
|
var import_withTmpPath = require("./utils/withTmpPath");
|
|
43
|
+
var ANTD_TEMPLATES_DIR = (0, import_path.join)(import_constants.TEMPLATES_DIR, "antd");
|
|
41
44
|
var antd_default = (api) => {
|
|
42
45
|
let pkgPath;
|
|
43
46
|
let antdVersion = "4.0.0";
|
|
@@ -52,6 +55,7 @@ var antd_default = (api) => {
|
|
|
52
55
|
}
|
|
53
56
|
const appComponentAvailable = import_plugin_utils.semver.gte(antdVersion, "5.1.0");
|
|
54
57
|
const appConfigAvailable = import_plugin_utils.semver.gte(antdVersion, "5.3.0");
|
|
58
|
+
const day2MomentAvailable = import_plugin_utils.semver.gte(antdVersion, "5.0.0");
|
|
55
59
|
api.describe({
|
|
56
60
|
config: {
|
|
57
61
|
schema({ zod }) {
|
|
@@ -66,7 +70,9 @@ var antd_default = (api) => {
|
|
|
66
70
|
style: zod.enum(["less", "css"]).describe("less or css, default less"),
|
|
67
71
|
theme: zod.record(zod.any()),
|
|
68
72
|
// Only antd@5.1.0 is supported
|
|
69
|
-
appConfig: zod.record(zod.any()).describe("Only antd@5.1.0 is supported")
|
|
73
|
+
appConfig: zod.record(zod.any()).describe("Only antd@5.1.0 is supported"),
|
|
74
|
+
// DatePicker & Calendar use moment version
|
|
75
|
+
momentPicker: zod.boolean().describe("Only antd@5.x is supported")
|
|
70
76
|
}).deepPartial();
|
|
71
77
|
}
|
|
72
78
|
},
|
|
@@ -98,9 +104,6 @@ var antd_default = (api) => {
|
|
|
98
104
|
memo.antd = antd = Object.assign(defaultConfig, antd);
|
|
99
105
|
}
|
|
100
106
|
memo.alias.antd = pkgPath;
|
|
101
|
-
if (antd.dayjs) {
|
|
102
|
-
memo.alias.moment = (0, import_path.dirname)(require.resolve("dayjs/package.json"));
|
|
103
|
-
}
|
|
104
107
|
if (antdVersion.startsWith("5")) {
|
|
105
108
|
const theme = require("@ant-design/antd-theme-variable");
|
|
106
109
|
memo.theme = {
|
|
@@ -151,6 +154,18 @@ var antd_default = (api) => {
|
|
|
151
154
|
}
|
|
152
155
|
return memo;
|
|
153
156
|
});
|
|
157
|
+
api.chainWebpack((memo) => {
|
|
158
|
+
if (api.config.antd.momentPicker) {
|
|
159
|
+
if (day2MomentAvailable) {
|
|
160
|
+
memo.plugin("antd-moment-webpack-plugin").use(import_moment_webpack_plugin.default);
|
|
161
|
+
} else {
|
|
162
|
+
api.logger.warn(
|
|
163
|
+
`MomentPicker is only available in version 5.0.0 and above, but you are using version ${antdVersion}`
|
|
164
|
+
);
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
return memo;
|
|
168
|
+
});
|
|
154
169
|
api.addExtraBabelPlugins(() => {
|
|
155
170
|
const style = antdVersion.startsWith("5") ? false : api.config.antd.style || "less";
|
|
156
171
|
return api.config.antd.import && !api.appData.vite ? [
|
|
@@ -176,7 +191,7 @@ var antd_default = (api) => {
|
|
|
176
191
|
configProvider: withConfigProvider && JSON.stringify(api.config.antd.configProvider),
|
|
177
192
|
appConfig: appComponentAvailable && JSON.stringify(api.config.antd.appConfig)
|
|
178
193
|
},
|
|
179
|
-
tplPath: (0, import_path.join)(
|
|
194
|
+
tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(ANTD_TEMPLATES_DIR, "runtime.ts.tpl"))
|
|
180
195
|
});
|
|
181
196
|
api.writeTmpFile({
|
|
182
197
|
path: "types.d.ts",
|
|
@@ -223,13 +238,17 @@ export type IRuntimeConfig = {
|
|
|
223
238
|
return [];
|
|
224
239
|
});
|
|
225
240
|
api.addEntryImportsAhead(() => {
|
|
241
|
+
const isAntd5 = antdVersion.startsWith("5");
|
|
226
242
|
const style = api.config.antd.style || "less";
|
|
227
|
-
const
|
|
228
|
-
|
|
229
|
-
{
|
|
243
|
+
const imports = [];
|
|
244
|
+
if (isAntd5) {
|
|
245
|
+
imports.push({ source: "antd/dist/reset.css" });
|
|
246
|
+
} else if (!api.config.antd.import || api.appData.vite) {
|
|
247
|
+
imports.push({
|
|
230
248
|
source: style === "less" ? "antd/dist/antd.less" : "antd/dist/antd.css"
|
|
231
|
-
}
|
|
232
|
-
|
|
249
|
+
});
|
|
250
|
+
}
|
|
251
|
+
return imports;
|
|
233
252
|
});
|
|
234
253
|
};
|
|
235
254
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const TEMPLATES_DIR: string;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name in all)
|
|
7
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
|
|
19
|
+
// src/constants.ts
|
|
20
|
+
var constants_exports = {};
|
|
21
|
+
__export(constants_exports, {
|
|
22
|
+
TEMPLATES_DIR: () => TEMPLATES_DIR
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(constants_exports);
|
|
25
|
+
var import_path = require("path");
|
|
26
|
+
var TEMPLATES_DIR = (0, import_path.join)(__dirname, "../templates");
|
|
27
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
28
|
+
0 && (module.exports = {
|
|
29
|
+
TEMPLATES_DIR
|
|
30
|
+
});
|
package/dist/layout.js
CHANGED
|
@@ -52,6 +52,7 @@ var getAllIcons = () => {
|
|
|
52
52
|
{}
|
|
53
53
|
);
|
|
54
54
|
};
|
|
55
|
+
var ANT_PRO_COMPONENT = "@ant-design/pro-components";
|
|
55
56
|
var layout_default = (api) => {
|
|
56
57
|
let antdVersion = "4.0.0";
|
|
57
58
|
try {
|
|
@@ -75,7 +76,7 @@ var layout_default = (api) => {
|
|
|
75
76
|
});
|
|
76
77
|
const depList = [
|
|
77
78
|
"@alipay/tech-ui",
|
|
78
|
-
|
|
79
|
+
ANT_PRO_COMPONENT,
|
|
79
80
|
"@ant-design/pro-layout"
|
|
80
81
|
];
|
|
81
82
|
const pkgHasDep = depList.find((dep) => {
|
|
@@ -94,9 +95,10 @@ var layout_default = (api) => {
|
|
|
94
95
|
if (pkgHasDep && api.cwd !== cwd && (0, import_fs.existsSync)((0, import_path.join)(cwd, "node_modules", pkgHasDep, "package.json"))) {
|
|
95
96
|
return (0, import_path.join)(cwd, "node_modules", pkgHasDep);
|
|
96
97
|
}
|
|
97
|
-
return (0, import_path.dirname)(require.resolve(
|
|
98
|
+
return (0, import_path.dirname)(require.resolve(`${ANT_PRO_COMPONENT}/package.json`));
|
|
98
99
|
};
|
|
99
100
|
const pkgPath = (0, import_plugin_utils.winPath)(getPkgPath());
|
|
101
|
+
const resolvedPkgPath = pkgPath || ANT_PRO_COMPONENT;
|
|
100
102
|
api.modifyAppData((memo) => {
|
|
101
103
|
const version = require(`${pkgPath}/package.json`).version;
|
|
102
104
|
memo.pluginLayout = {
|
|
@@ -112,8 +114,11 @@ var layout_default = (api) => {
|
|
|
112
114
|
}
|
|
113
115
|
return memo;
|
|
114
116
|
});
|
|
117
|
+
const isFlattedDepsDir = [import_plugin_utils.NpmClientEnum.npm, import_plugin_utils.NpmClientEnum.yarn].includes(
|
|
118
|
+
api.appData.npmClient
|
|
119
|
+
);
|
|
115
120
|
api.onGenerateFiles(() => {
|
|
116
|
-
const PKG_TYPE_REFERENCE = `/// <reference types="${
|
|
121
|
+
const PKG_TYPE_REFERENCE = `/// <reference types="${isFlattedDepsDir ? ANT_PRO_COMPONENT : resolvedPkgPath}" />`;
|
|
117
122
|
const hasInitialStatePlugin = api.config.initialState;
|
|
118
123
|
api.writeTmpFile({
|
|
119
124
|
path: "Layout.tsx",
|
|
@@ -124,7 +129,7 @@ import type { IRoute } from 'umi';
|
|
|
124
129
|
import React, { useMemo } from 'react';
|
|
125
130
|
import {
|
|
126
131
|
ProLayout,
|
|
127
|
-
} from "${
|
|
132
|
+
} from "${resolvedPkgPath}";
|
|
128
133
|
import './Layout.less';
|
|
129
134
|
import Logo from './Logo';
|
|
130
135
|
import Exception from './Exception';
|
|
@@ -299,7 +304,7 @@ const { formatMessage } = useIntl();
|
|
|
299
304
|
path: "types.d.ts",
|
|
300
305
|
content: `
|
|
301
306
|
${PKG_TYPE_REFERENCE}
|
|
302
|
-
import type { ProLayoutProps, HeaderProps } from "${
|
|
307
|
+
import type { ProLayoutProps, HeaderProps } from "${resolvedPkgPath}";
|
|
303
308
|
${hasInitialStatePlugin ? `import type InitialStateType from '@@/plugin-initialState/@@initialState';
|
|
304
309
|
type InitDataType = ReturnType<typeof InitialStateType>;
|
|
305
310
|
` : "type InitDataType = any;"}
|
package/dist/locale.js
CHANGED
|
@@ -37,8 +37,10 @@ var import_fs = require("fs");
|
|
|
37
37
|
var import_path = require("path");
|
|
38
38
|
var import_umi = require("umi");
|
|
39
39
|
var import_plugin_utils = require("umi/plugin-utils");
|
|
40
|
+
var import_constants = require("./constants");
|
|
40
41
|
var import_localeUtils = require("./utils/localeUtils");
|
|
41
42
|
var import_withTmpPath = require("./utils/withTmpPath");
|
|
43
|
+
var LOCALE_TEMPLATES_DIR = (0, import_path.join)(import_constants.TEMPLATES_DIR, "locale");
|
|
42
44
|
var packageNormalize = (packageName) => packageName.replace(/[@\/\-.]/g, "_");
|
|
43
45
|
var locale_default = (api) => {
|
|
44
46
|
let hasAntd = false;
|
|
@@ -108,7 +110,7 @@ var locale_default = (api) => {
|
|
|
108
110
|
api.onGenerateFiles(async () => {
|
|
109
111
|
var _a, _b, _c, _d;
|
|
110
112
|
const localeTpl = (0, import_fs.readFileSync)(
|
|
111
|
-
(0, import_path.join)(
|
|
113
|
+
(0, import_path.join)(LOCALE_TEMPLATES_DIR, "locale.tpl"),
|
|
112
114
|
"utf-8"
|
|
113
115
|
);
|
|
114
116
|
const resolveKey = api.config.moment2dayjs ? "dayjs" : "moment";
|
|
@@ -165,7 +167,7 @@ var locale_default = (api) => {
|
|
|
165
167
|
path: "locale.tsx"
|
|
166
168
|
});
|
|
167
169
|
const localeExportsTpl = (0, import_fs.readFileSync)(
|
|
168
|
-
(0, import_path.join)(
|
|
170
|
+
(0, import_path.join)(LOCALE_TEMPLATES_DIR, "localeExports.tpl"),
|
|
169
171
|
"utf-8"
|
|
170
172
|
);
|
|
171
173
|
const localeDirName = "locales";
|
|
@@ -197,7 +199,7 @@ var locale_default = (api) => {
|
|
|
197
199
|
})
|
|
198
200
|
});
|
|
199
201
|
const runtimeTpl = (0, import_fs.readFileSync)(
|
|
200
|
-
(0, import_path.join)(
|
|
202
|
+
(0, import_path.join)(LOCALE_TEMPLATES_DIR, "runtime.tpl"),
|
|
201
203
|
"utf-8"
|
|
202
204
|
);
|
|
203
205
|
api.writeTmpFile({
|
|
@@ -207,7 +209,7 @@ var locale_default = (api) => {
|
|
|
207
209
|
})
|
|
208
210
|
});
|
|
209
211
|
const selectLang = (0, import_fs.readFileSync)(
|
|
210
|
-
(0, import_path.join)(
|
|
212
|
+
(0, import_path.join)(LOCALE_TEMPLATES_DIR, "SelectLang.tpl"),
|
|
211
213
|
"utf-8"
|
|
212
214
|
);
|
|
213
215
|
api.writeTmpFile({
|
package/dist/mf.js
CHANGED
|
@@ -25,10 +25,12 @@ module.exports = __toCommonJS(mf_exports);
|
|
|
25
25
|
var import_fs = require("fs");
|
|
26
26
|
var import_path = require("path");
|
|
27
27
|
var import_plugin_utils = require("umi/plugin-utils");
|
|
28
|
+
var import_constants = require("./constants");
|
|
28
29
|
var import_mfUtils = require("./utils/mfUtils");
|
|
29
30
|
var { isEmpty } = import_plugin_utils.lodash;
|
|
30
31
|
var mfSetupPathFileName = "_mf_setup-public-path.js";
|
|
31
32
|
var mfAsyncEntryFileName = "asyncEntry.ts";
|
|
33
|
+
var MF_TEMPLATES_DIR = (0, import_path.join)(import_constants.TEMPLATES_DIR, "mf");
|
|
32
34
|
function mf(api) {
|
|
33
35
|
api.describe({
|
|
34
36
|
key: "mf",
|
|
@@ -121,7 +123,7 @@ function mf(api) {
|
|
|
121
123
|
context: {
|
|
122
124
|
remoteCodeString: (0, import_mfUtils.toRemotesCodeString)(remotes)
|
|
123
125
|
},
|
|
124
|
-
tplPath: (0, import_path.join)(
|
|
126
|
+
tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(MF_TEMPLATES_DIR, "runtime.ts.tpl"))
|
|
125
127
|
});
|
|
126
128
|
if (api.env === "development" && api.config.mfsu) {
|
|
127
129
|
return;
|
package/dist/qiankun/slave.js
CHANGED
|
@@ -263,15 +263,24 @@ export { MicroAppLink } from './MicroAppLink';
|
|
|
263
263
|
key: "onLocalProxyStart",
|
|
264
264
|
type: api.ApplyPluginsType.event
|
|
265
265
|
});
|
|
266
|
+
const modifyLocalProxyOpts = await api.applyPlugins({
|
|
267
|
+
key: "modifyLocalProxyOpts",
|
|
268
|
+
type: api.ApplyPluginsType.modify,
|
|
269
|
+
initialValue: {}
|
|
270
|
+
}) ?? {};
|
|
271
|
+
const localProxyOpts = {
|
|
272
|
+
target: masterEntry,
|
|
273
|
+
secure: false,
|
|
274
|
+
ignorePath: false,
|
|
275
|
+
followRedirects: false,
|
|
276
|
+
changeOrigin: true,
|
|
277
|
+
selfHandleResponse: true,
|
|
278
|
+
...modifyLocalProxyOpts
|
|
279
|
+
};
|
|
266
280
|
return (0, import_http_proxy_middleware.createProxyMiddleware)(
|
|
267
281
|
(pathname) => pathname !== "/local-dev-server",
|
|
268
282
|
{
|
|
269
|
-
|
|
270
|
-
secure: false,
|
|
271
|
-
ignorePath: false,
|
|
272
|
-
followRedirects: false,
|
|
273
|
-
changeOrigin: true,
|
|
274
|
-
selfHandleResponse: true,
|
|
283
|
+
...localProxyOpts,
|
|
275
284
|
onProxyReq(proxyReq) {
|
|
276
285
|
api.applyPlugins({
|
|
277
286
|
key: "onLocalProxyReq",
|
|
@@ -284,13 +293,18 @@ export { MicroAppLink } from './MicroAppLink';
|
|
|
284
293
|
async (responseBuffer, proxyRes, req2, res2) => {
|
|
285
294
|
var _a2;
|
|
286
295
|
if (proxyRes.statusCode === 302) {
|
|
287
|
-
const
|
|
296
|
+
const { ignorePath = false } = localProxyOpts;
|
|
297
|
+
const { hostname, url, protocol } = req2;
|
|
288
298
|
const port = process.env.PORT || ((_a2 = api.appData) == null ? void 0 : _a2.port);
|
|
289
|
-
const
|
|
290
|
-
const
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
299
|
+
const gotoBasePart = `${protocol}://${hostname}:${port}${ignorePath && url ? url : "/"}`;
|
|
300
|
+
const fromBasePart = masterEntry;
|
|
301
|
+
const locationUrl = proxyRes.headers.location || "";
|
|
302
|
+
const [originAndPath, searchParams] = locationUrl.split("?");
|
|
303
|
+
const searchHandled = searchParams ? `?${searchParams.replace(
|
|
304
|
+
encodeURIComponent(fromBasePart),
|
|
305
|
+
encodeURIComponent(gotoBasePart)
|
|
306
|
+
)}` : "";
|
|
307
|
+
const redirectUrl = `${originAndPath}${searchHandled}`;
|
|
294
308
|
const redirectMessage = `[@umijs/plugin-qiankun]: redirect to ${redirectUrl}`;
|
|
295
309
|
api.logger.info(redirectMessage);
|
|
296
310
|
res2.statusCode = 302;
|
|
@@ -3,11 +3,12 @@
|
|
|
3
3
|
__USE_MODEL__;
|
|
4
4
|
import concat from 'lodash/concat';
|
|
5
5
|
import mergeWith from 'lodash/mergeWith';
|
|
6
|
+
import isEqual from 'lodash/isEqual';
|
|
6
7
|
import noop from 'lodash/noop';
|
|
7
8
|
import {
|
|
8
9
|
FrameworkConfiguration,
|
|
9
10
|
loadMicroApp,
|
|
10
|
-
MicroApp as
|
|
11
|
+
MicroApp as MicroAppTypeDefinition,
|
|
11
12
|
prefetchApps,
|
|
12
13
|
} from 'qiankun';
|
|
13
14
|
import React, {
|
|
@@ -36,6 +37,12 @@ type MemoryHistory = {
|
|
|
36
37
|
type?: 'memory';
|
|
37
38
|
} & any;
|
|
38
39
|
|
|
40
|
+
type MicroAppType = MicroAppTypeDefinition & {
|
|
41
|
+
_unmounting?: boolean;
|
|
42
|
+
_updatingPromise?: Promise<void>;
|
|
43
|
+
_updatingTimestamp?: number;
|
|
44
|
+
};
|
|
45
|
+
|
|
39
46
|
export type Props = {
|
|
40
47
|
name: string;
|
|
41
48
|
settings?: FrameworkConfiguration;
|
|
@@ -58,25 +65,17 @@ export type Props = {
|
|
|
58
65
|
className?: string;
|
|
59
66
|
} & Record<string, any>;
|
|
60
67
|
|
|
61
|
-
function unmountMicroApp(
|
|
62
|
-
microApp
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
microApp.unmount();
|
|
70
|
-
break;
|
|
71
|
-
case 'UPDATING':
|
|
72
|
-
// UPDATING 阶段 updatingPromise 一定存在
|
|
73
|
-
updatingPromise!.then(() => microApp.unmount());
|
|
74
|
-
break;
|
|
75
|
-
default:
|
|
76
|
-
break;
|
|
77
|
-
}
|
|
78
|
-
});
|
|
68
|
+
function unmountMicroApp(microApp: MicroAppType) {
|
|
69
|
+
microApp.mountPromise.then(() => microApp.unmount());
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
function useDeepCompare<T>(value: T): T {
|
|
73
|
+
const ref = useRef<T>(value);
|
|
74
|
+
if (!isEqual(value, ref.current)) {
|
|
75
|
+
ref.current = value;
|
|
79
76
|
}
|
|
77
|
+
|
|
78
|
+
return ref.current;
|
|
80
79
|
}
|
|
81
80
|
|
|
82
81
|
let noneMounted = true;
|
|
@@ -103,7 +102,6 @@ export const MicroApp = forwardRef(
|
|
|
103
102
|
...propsFromParams
|
|
104
103
|
} = componentProps;
|
|
105
104
|
|
|
106
|
-
// ref: https://github.com/umijs/plugins/pull/866
|
|
107
105
|
// name 跟 appNameKeyAlias 这两个 key 同时存在时,优先使用 name,避免对存量应用造成 breaking change。
|
|
108
106
|
// 比如 appNameKeyAlias 配置是 id,但之前 id 正好作为普通的 props 使用过,如 <MicroApp name="app" id="123" />
|
|
109
107
|
// 正常场景会优先匹配 appNameKeyAlias 对应的字段,fallback 到 name,避免对已经使用 <MicroApp name="app" /> 的应用造成影响
|
|
@@ -138,8 +136,6 @@ export const MicroApp = forwardRef(
|
|
|
138
136
|
|
|
139
137
|
const containerRef = useRef<HTMLDivElement>();
|
|
140
138
|
const microAppRef = useRef<MicroAppType>();
|
|
141
|
-
const updatingPromise = useRef<Promise<any>>();
|
|
142
|
-
const updatingTimestamp = useRef(Date.now());
|
|
143
139
|
|
|
144
140
|
useImperativeHandle(componentRef, () => microAppRef.current);
|
|
145
141
|
|
|
@@ -148,8 +144,8 @@ export const MicroApp = forwardRef(
|
|
|
148
144
|
if (!appConfig) {
|
|
149
145
|
setComponentError(
|
|
150
146
|
new Error(
|
|
151
|
-
`[@umijs/plugin-qiankun]: Can not find the configuration of ${name} app
|
|
152
|
-
)
|
|
147
|
+
`[@umijs/plugin-qiankun]: Can not find the configuration of ${name} app! Currently, only the following apps are configured:\n${JSON.stringify(apps, null, 2)}`
|
|
148
|
+
)
|
|
153
149
|
);
|
|
154
150
|
}
|
|
155
151
|
return noop;
|
|
@@ -159,10 +155,7 @@ export const MicroApp = forwardRef(
|
|
|
159
155
|
const stateForSlave = (useModel || noop)(
|
|
160
156
|
qiankunStateForSlaveModelNamespace,
|
|
161
157
|
);
|
|
162
|
-
const {
|
|
163
|
-
entry,
|
|
164
|
-
props: { settings: settingsFromConfig = {}, ...propsFromConfig } = {},
|
|
165
|
-
} = appConfig || {};
|
|
158
|
+
const { entry, props: { settings: settingsFromConfig = {}, ...propsFromConfig } = {} } = appConfig || {};
|
|
166
159
|
|
|
167
160
|
useEffect(() => {
|
|
168
161
|
setComponentError(null);
|
|
@@ -231,37 +224,39 @@ export const MicroApp = forwardRef(
|
|
|
231
224
|
},
|
|
232
225
|
);
|
|
233
226
|
|
|
234
|
-
return () =>
|
|
235
|
-
|
|
227
|
+
return () => {
|
|
228
|
+
const microApp = microAppRef.current;
|
|
229
|
+
if (microApp) {
|
|
230
|
+
// 微应用 unmount 是异步的,中间的流转状态不能确定,所有需要一个标志位来确保 unmount 开始之后不会再触发 update
|
|
231
|
+
microApp._unmounting = true;
|
|
232
|
+
unmountMicroApp(microApp);
|
|
233
|
+
}
|
|
234
|
+
};
|
|
236
235
|
}, [name]);
|
|
237
236
|
|
|
238
237
|
useEffect(() => {
|
|
239
238
|
const microApp = microAppRef.current;
|
|
240
239
|
if (microApp) {
|
|
241
|
-
if (!
|
|
240
|
+
if (!microApp._updatingPromise) {
|
|
242
241
|
// 初始化 updatingPromise 为 microApp.mountPromise,从而确保后续更新是在应用 mount 完成之后
|
|
243
|
-
|
|
242
|
+
microApp._updatingPromise = microApp.mountPromise;
|
|
243
|
+
microApp._updatingTimestamp = Date.now();
|
|
244
244
|
} else {
|
|
245
245
|
// 确保 microApp.update 调用是跟组件状态变更顺序一致的,且后一个微应用更新必须等待前一个更新完成
|
|
246
|
-
|
|
246
|
+
microApp._updatingPromise = microApp._updatingPromise.then(() => {
|
|
247
247
|
const canUpdate = (microApp?: MicroAppType) =>
|
|
248
|
-
microApp?.update && microApp.getStatus() === 'MOUNTED';
|
|
248
|
+
microApp?.update && microApp.getStatus() === 'MOUNTED' && !microApp._unmounting;
|
|
249
249
|
if (canUpdate(microApp)) {
|
|
250
250
|
const props = {
|
|
251
251
|
...propsFromConfig,
|
|
252
252
|
...stateForSlave,
|
|
253
253
|
...propsFromParams,
|
|
254
|
-
__globalRoutesInfo: {
|
|
255
|
-
appNameKeyAlias,
|
|
256
|
-
masterHistoryType,
|
|
257
|
-
base: globalSettings.base,
|
|
258
|
-
microAppRoutes: globalSettings.microAppRoutes,
|
|
259
|
-
},
|
|
260
254
|
setLoading,
|
|
261
255
|
};
|
|
262
256
|
|
|
263
257
|
if (process.env.NODE_ENV === 'development') {
|
|
264
|
-
|
|
258
|
+
const updatingTimestamp = microApp._updatingTimestamp!;
|
|
259
|
+
if (Date.now() - updatingTimestamp < 200) {
|
|
265
260
|
console.warn(
|
|
266
261
|
`[@umijs/plugin-qiankun] It seems like microApp ${name} is updating too many times in a short time(200ms), you may need to do some optimization to avoid the unnecessary re-rendering.`,
|
|
267
262
|
);
|
|
@@ -271,7 +266,7 @@ export const MicroApp = forwardRef(
|
|
|
271
266
|
`[@umijs/plugin-qiankun] MicroApp ${name} is updating with props: `,
|
|
272
267
|
props,
|
|
273
268
|
);
|
|
274
|
-
|
|
269
|
+
microApp._updatingTimestamp = Date.now();
|
|
275
270
|
}
|
|
276
271
|
|
|
277
272
|
// 返回 microApp.update 形成链式调用
|
|
@@ -285,7 +280,7 @@ export const MicroApp = forwardRef(
|
|
|
285
280
|
}
|
|
286
281
|
|
|
287
282
|
return noop;
|
|
288
|
-
},
|
|
283
|
+
}, [useDeepCompare({ ...stateForSlave, ...propsFromParams })]);
|
|
289
284
|
|
|
290
285
|
// 未配置自定义 loader 且开启了 autoSetLoading 场景下,使用插件默认的 loader,否则使用自定义 loader
|
|
291
286
|
const microAppLoader =
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@umijs/plugins",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.67",
|
|
4
4
|
"description": "@umijs/plugins",
|
|
5
5
|
"homepage": "https://github.com/umijs/umi/tree/master/packages/plugins#readme",
|
|
6
6
|
"bugs": "https://github.com/umijs/umi/issues",
|
|
@@ -14,12 +14,13 @@
|
|
|
14
14
|
"files": [
|
|
15
15
|
"dist",
|
|
16
16
|
"libs",
|
|
17
|
-
"
|
|
17
|
+
"templates"
|
|
18
18
|
],
|
|
19
19
|
"dependencies": {
|
|
20
20
|
"@ahooksjs/use-request": "^2.0.0",
|
|
21
21
|
"@ant-design/antd-theme-variable": "^1.0.0",
|
|
22
22
|
"@ant-design/icons": "^4.7.0",
|
|
23
|
+
"@ant-design/moment-webpack-plugin": "^0.0.3",
|
|
23
24
|
"@ant-design/pro-components": "^2.0.1",
|
|
24
25
|
"@tanstack/react-query": "^4.24.10",
|
|
25
26
|
"@tanstack/react-query-devtools": "^4.24.10",
|
|
@@ -42,12 +43,12 @@
|
|
|
42
43
|
"styled-components": "6.0.0-beta.9",
|
|
43
44
|
"tslib": "^2",
|
|
44
45
|
"warning": "^4.0.3",
|
|
45
|
-
"@umijs/bundler-utils": "4.0.
|
|
46
|
+
"@umijs/bundler-utils": "4.0.67",
|
|
46
47
|
"@umijs/valtio": "1.0.3"
|
|
47
48
|
},
|
|
48
49
|
"devDependencies": {
|
|
49
50
|
"antd": "^4.24.1",
|
|
50
|
-
"umi": "4.0.
|
|
51
|
+
"umi": "4.0.67"
|
|
51
52
|
},
|
|
52
53
|
"publishConfig": {
|
|
53
54
|
"access": "public"
|
|
@@ -13,30 +13,32 @@ import {
|
|
|
13
13
|
import { ApplyPluginsType } from 'umi';
|
|
14
14
|
import { getPluginManager } from '../core/plugin';
|
|
15
15
|
|
|
16
|
+
let cacheAntdConfig = null;
|
|
17
|
+
|
|
18
|
+
const getAntdConfig = () => {
|
|
19
|
+
if(!cacheAntdConfig){
|
|
20
|
+
cacheAntdConfig = getPluginManager().applyPlugins({
|
|
21
|
+
key: 'antd',
|
|
22
|
+
type: ApplyPluginsType.modify,
|
|
23
|
+
initialValue: {
|
|
24
|
+
{{#configProvider}}
|
|
25
|
+
...{{{configProvider}}},
|
|
26
|
+
{{/configProvider}}
|
|
27
|
+
{{#appConfig}}
|
|
28
|
+
appConfig: {{{appConfig}}},
|
|
29
|
+
{{/appConfig}}
|
|
30
|
+
},
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
return cacheAntdConfig;
|
|
34
|
+
}
|
|
35
|
+
|
|
16
36
|
export function rootContainer(rawContainer) {
|
|
17
37
|
const {
|
|
18
|
-
appConfig
|
|
38
|
+
appConfig,
|
|
19
39
|
...finalConfigProvider
|
|
20
|
-
} =
|
|
21
|
-
key: 'antd',
|
|
22
|
-
type: ApplyPluginsType.modify,
|
|
23
|
-
initialValue: {
|
|
24
|
-
{{#configProvider}}
|
|
25
|
-
...{{{configProvider}}},
|
|
26
|
-
{{/configProvider}}
|
|
27
|
-
{{#appConfig}}
|
|
28
|
-
appConfig: {{{appConfig}}},
|
|
29
|
-
{{/appConfig}}
|
|
30
|
-
},
|
|
31
|
-
});
|
|
32
|
-
|
|
40
|
+
} = getAntdConfig();
|
|
33
41
|
let container = rawContainer;
|
|
34
|
-
|
|
35
|
-
{{#appConfig}}
|
|
36
|
-
// The App component should be under ConfigProvider
|
|
37
|
-
container = <App {...finalAppConfig}>{container}</App>;
|
|
38
|
-
{{/appConfig}}
|
|
39
|
-
|
|
40
42
|
{{#configProvider}}
|
|
41
43
|
if (finalConfigProvider.prefixCls) {
|
|
42
44
|
Modal.config({
|
|
@@ -61,3 +63,14 @@ export function rootContainer(rawContainer) {
|
|
|
61
63
|
|
|
62
64
|
return container;
|
|
63
65
|
}
|
|
66
|
+
|
|
67
|
+
{{#appConfig}}
|
|
68
|
+
// The App component should be under ConfigProvider
|
|
69
|
+
// plugin-locale has other ConfigProvider
|
|
70
|
+
export function innerProvider(container: any) {
|
|
71
|
+
const {
|
|
72
|
+
appConfig: finalAppConfig = {},
|
|
73
|
+
} = getAntdConfig();
|
|
74
|
+
return <App {...finalAppConfig}>{container}</App>;
|
|
75
|
+
}
|
|
76
|
+
{{/appConfig}}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|