@xingtukeji/micro 1.1.11 → 1.1.12
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/README.md +5 -0
- package/dist/index.js +104 -98
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -48,3 +48,8 @@ microInit({
|
|
|
48
48
|
```javascript
|
|
49
49
|
http://192.168.100.127:8000/console/?__XT_MICRO_microtest2=http://localhost:5173/?test=123#/page2#/micro/microtest2
|
|
50
50
|
```
|
|
51
|
+
|
|
52
|
+
```javascript
|
|
53
|
+
window.__XT_MICRO_VERSION; //获取微前端框架版本
|
|
54
|
+
window.__XT_MICRO_APP; //获取微应用信息,包括主应用的 location 信息
|
|
55
|
+
```
|
package/dist/index.js
CHANGED
|
@@ -1,41 +1,43 @@
|
|
|
1
1
|
(function(){"use strict";try{if(typeof document!="undefined"){var e=document.createElement("style");e.appendChild(document.createTextNode('.xt-micro{width:100%;height:100%;overflow:hidden;background-color:transparent}.xt-micro:before{content:"加载中";position:absolute;inset:0;display:flex;justify-content:center;align-items:center;z-index:-1}.micro-iframe{width:100%;height:100%;border:none;margin:0;padding:0}.micro-iframe:after{content:"加载中";position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background:#fff}')),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
|
-
var
|
|
3
|
-
var
|
|
2
|
+
var v = Object.defineProperty, L = Object.defineProperties;
|
|
3
|
+
var T = Object.getOwnPropertyDescriptors;
|
|
4
4
|
var M = Object.getOwnPropertySymbols;
|
|
5
|
-
var
|
|
6
|
-
var
|
|
5
|
+
var b = Object.prototype.hasOwnProperty, x = Object.prototype.propertyIsEnumerable;
|
|
6
|
+
var y = (e, t, n) => t in e ? v(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, l = (e, t) => {
|
|
7
7
|
for (var n in t || (t = {}))
|
|
8
|
-
|
|
8
|
+
b.call(t, n) && y(e, n, t[n]);
|
|
9
9
|
if (M)
|
|
10
10
|
for (var n of M(t))
|
|
11
|
-
x.call(t, n) &&
|
|
11
|
+
x.call(t, n) && y(e, n, t[n]);
|
|
12
12
|
return e;
|
|
13
|
-
}, f = (e, t) =>
|
|
14
|
-
var m = (e, t, n) => (
|
|
13
|
+
}, f = (e, t) => L(e, T(t));
|
|
14
|
+
var m = (e, t, n) => (y(e, typeof t != "symbol" ? t + "" : t, n), n);
|
|
15
15
|
var g = (e, t, n) => new Promise((r, o) => {
|
|
16
|
-
var a = (
|
|
16
|
+
var a = (d) => {
|
|
17
17
|
try {
|
|
18
|
-
|
|
18
|
+
s(n.next(d));
|
|
19
19
|
} catch (h) {
|
|
20
20
|
o(h);
|
|
21
21
|
}
|
|
22
|
-
},
|
|
22
|
+
}, c = (d) => {
|
|
23
23
|
try {
|
|
24
|
-
|
|
24
|
+
s(n.throw(d));
|
|
25
25
|
} catch (h) {
|
|
26
26
|
o(h);
|
|
27
27
|
}
|
|
28
|
-
},
|
|
29
|
-
|
|
28
|
+
}, s = (d) => d.done ? r(d.value) : Promise.resolve(d.value).then(a, c);
|
|
29
|
+
s((n = n.apply(e, t)).next());
|
|
30
30
|
});
|
|
31
31
|
import { ref as P, defineComponent as $, watch as X, onMounted as k, onUnmounted as H, openBlock as N, createElementBlock as j, mergeProps as B } from "vue";
|
|
32
|
-
const
|
|
32
|
+
const i = {
|
|
33
33
|
KEY: "$xtm",
|
|
34
34
|
// 父应用注入子应用实例的key
|
|
35
35
|
IS_MICRO: "__XT_MICRO",
|
|
36
36
|
// 是否在微应用中
|
|
37
37
|
MICRO_NAME: "__XT_MICRO_NAME",
|
|
38
38
|
// 微应用名称
|
|
39
|
+
MICRO_TYPE: "__XT_MICRO_TYPE",
|
|
40
|
+
// 微应用类型 'parent' | 'child'
|
|
39
41
|
MICRO_TOKEN: "__XT_MICRO_TOKEN",
|
|
40
42
|
// 微应用token
|
|
41
43
|
MICRO_APP: "__XT_MICRO_APP",
|
|
@@ -77,16 +79,16 @@ function K(e, t) {
|
|
|
77
79
|
};
|
|
78
80
|
}
|
|
79
81
|
function C(e, t, n) {
|
|
80
|
-
const [r, o] = e.split("#"), a = new URL(r),
|
|
81
|
-
return t =
|
|
82
|
+
const [r, o] = e.split("#"), a = new URL(r), c = a.searchParams;
|
|
83
|
+
return t = i.URL_PARAM_PREFIX + t, c.has(t) ? c.set(t, n) : c.append(t, n), o && (a.hash = o), a.search = c.toString(), a.toString();
|
|
82
84
|
}
|
|
83
85
|
const S = (e) => g(void 0, null, function* () {
|
|
84
86
|
return new Promise((t) => {
|
|
85
87
|
window.addEventListener("message", (n) => {
|
|
86
|
-
n.data.cmd === "$xt/micro/info" && (n.data.data.mainMicroVersion !== u && console.warn(
|
|
88
|
+
console.debug("child ipcSyncAppInfo receive message", n.data), n.data.cmd === "$xt/micro/info" && (n.data.data.mainMicroVersion !== u && console.warn(
|
|
87
89
|
`子应用版本与主应用版本不一致,${e}子应用版本:${u},主应用版本:${n.data.data.mainMicroVersion}`
|
|
88
90
|
), t(n.data.data));
|
|
89
|
-
}), window.parent.postMessage(
|
|
91
|
+
}), console.debug("child ipcSyncAppInfo send message", e), window.parent.postMessage(
|
|
90
92
|
{
|
|
91
93
|
cmd: "$xt/micro/info",
|
|
92
94
|
data: e
|
|
@@ -104,7 +106,7 @@ const S = (e) => g(void 0, null, function* () {
|
|
|
104
106
|
getQueryParameter: p,
|
|
105
107
|
ipcSyncAppInfo: S
|
|
106
108
|
}, Symbol.toStringTag, { value: "Module" })), O = P(!1);
|
|
107
|
-
Object.defineProperty(window,
|
|
109
|
+
Object.defineProperty(window, i.IS_MICRO, {
|
|
108
110
|
get: function() {
|
|
109
111
|
return O.value;
|
|
110
112
|
},
|
|
@@ -112,37 +114,37 @@ Object.defineProperty(window, c.IS_MICRO, {
|
|
|
112
114
|
O.value = e;
|
|
113
115
|
}
|
|
114
116
|
});
|
|
115
|
-
const
|
|
116
|
-
function t(
|
|
117
|
-
return
|
|
117
|
+
const I = (e) => `${i.DOM_ID_PREFIX}${e}`, D = (e) => {
|
|
118
|
+
function t(s) {
|
|
119
|
+
return s !== null && typeof s == "object" && !Array.isArray(s);
|
|
118
120
|
}
|
|
119
121
|
const n = typeof e.params == "function" ? e.params() : t(e.params) ? e.params : {}, r = typeof e.token == "function" ? e.token() : t(e.token) ? e.token : "", o = new URL(
|
|
120
122
|
e.url.indexOf("http") > -1 ? e.url : window.location.origin + e.url
|
|
121
|
-
), a = p(
|
|
123
|
+
), a = p(i.URL_PARAM_PREFIX + e.name);
|
|
122
124
|
if (a) {
|
|
123
|
-
const
|
|
124
|
-
if (
|
|
125
|
-
const
|
|
126
|
-
|
|
125
|
+
const s = E(a, e.url, !0);
|
|
126
|
+
if (s) {
|
|
127
|
+
const d = new URL(s);
|
|
128
|
+
d.searchParams.forEach((A, U) => {
|
|
127
129
|
o.searchParams.set(U, A);
|
|
128
|
-
}), o.hash =
|
|
130
|
+
}), o.hash = d.hash;
|
|
129
131
|
}
|
|
130
132
|
}
|
|
131
|
-
if (o.searchParams.set(
|
|
132
|
-
for (let
|
|
133
|
-
o.searchParams.set(
|
|
134
|
-
const
|
|
135
|
-
return
|
|
136
|
-
},
|
|
133
|
+
if (o.searchParams.set(i.IS_MICRO, !0 + ""), o.searchParams.set(i.MICRO_NAME, e.name), r && o.searchParams.set(i.MICRO_TOKEN, r), n)
|
|
134
|
+
for (let s of Object.keys(n))
|
|
135
|
+
o.searchParams.set(s, n[s]);
|
|
136
|
+
const c = new URL(window.location.href);
|
|
137
|
+
return c.searchParams.delete(e.name), window.history.replaceState({}, "", c.href), o.href;
|
|
138
|
+
}, Y = () => {
|
|
137
139
|
const e = document.createElement("div");
|
|
138
140
|
return e.innerHTML = "应用加载中...", e.style.textAlign = "center", e.style.lineHeight = "100px", e.style.fontSize = "20px", e.style.color = "#999", e.style.position = "absolute", e.style.top = "0", e.style.left = "0", e.style.right = "0", e.style.bottom = "0", e.style.zIndex = "999", e.style.background = "transparent", e.style["mix-blend-mode"] = "difference", e;
|
|
139
|
-
},
|
|
141
|
+
}, W = (e) => {
|
|
140
142
|
e.style.opacity = "0", setTimeout(() => {
|
|
141
143
|
e.remove();
|
|
142
144
|
}, 500);
|
|
143
|
-
},
|
|
145
|
+
}, q = (e) => {
|
|
144
146
|
const t = document.createElement("iframe");
|
|
145
|
-
t.id =
|
|
147
|
+
t.id = I(e.app.name);
|
|
146
148
|
const n = D(e.app);
|
|
147
149
|
t.src = n, t.style.width = "100%", t.style.height = "100%", t.style.border = "none", t.style.margin = "0", t.style.padding = "0", t.style.backgroundColor = "transparent", t.style["color-scheme"] = "unset", t.style.visibility = "hidden", t.addEventListener("load", (o) => (t.style.visibility = "visible", e.onLoad.call(e, o))), t.addEventListener(
|
|
148
150
|
"error",
|
|
@@ -158,7 +160,7 @@ const R = (e) => `${c.DOM_ID_PREFIX}${e}`, D = (e) => {
|
|
|
158
160
|
});
|
|
159
161
|
return r.observe(e.panel, { childList: !0 }), t;
|
|
160
162
|
};
|
|
161
|
-
class
|
|
163
|
+
class z {
|
|
162
164
|
constructor(t) {
|
|
163
165
|
m(this, "app");
|
|
164
166
|
m(this, "dom");
|
|
@@ -171,9 +173,9 @@ class G {
|
|
|
171
173
|
let r;
|
|
172
174
|
if (t ? (typeof t == "string" ? r = document.querySelector(t) : r = t, r.innerHTML = "") : r = document.body, r) {
|
|
173
175
|
this.panel = r;
|
|
174
|
-
let o = document.getElementById(
|
|
175
|
-
o || (o =
|
|
176
|
-
const a =
|
|
176
|
+
let o = document.getElementById(I(this.app.name));
|
|
177
|
+
o || (o = q(this), this.dom = o), n ? o.style.display = "none" : o.style.removeProperty("display");
|
|
178
|
+
const a = Y();
|
|
177
179
|
this.loadingTimer = setTimeout(() => {
|
|
178
180
|
this.loading = a, r.appendChild(a);
|
|
179
181
|
}, 1e3), r.appendChild(o);
|
|
@@ -182,7 +184,7 @@ class G {
|
|
|
182
184
|
}
|
|
183
185
|
unmount() {
|
|
184
186
|
var n;
|
|
185
|
-
const t = document.getElementById(
|
|
187
|
+
const t = document.getElementById(I(this.app.name));
|
|
186
188
|
if (t)
|
|
187
189
|
this.app.preload ? (t.style.display = "none", document.body.appendChild(t)) : (n = this.panel) == null || n.removeChild(t);
|
|
188
190
|
else
|
|
@@ -207,10 +209,10 @@ class G {
|
|
|
207
209
|
this.dom.src = t;
|
|
208
210
|
}
|
|
209
211
|
changeOptions(t) {
|
|
210
|
-
this.app =
|
|
212
|
+
this.app = l(l({}, this.app), t);
|
|
211
213
|
}
|
|
212
214
|
onLoad(t) {
|
|
213
|
-
console.debug("app onLoad", this.app.name), this.loadingTimer && clearTimeout(this.loadingTimer), this.loading &&
|
|
215
|
+
console.debug("app onLoad", this.app.name), this.loadingTimer && clearTimeout(this.loadingTimer), this.loading && W(this.loading), G(this), this.app.onLoad && this.app.onLoad(t, this);
|
|
214
216
|
}
|
|
215
217
|
onUnload(t) {
|
|
216
218
|
console.debug("app onUnload", this.app.name), this.app.onUnload && this.app.onUnload(t, this);
|
|
@@ -219,7 +221,7 @@ class G {
|
|
|
219
221
|
console.error("app onError", this.app.name), this.app.onError && this.app.onError(t, this);
|
|
220
222
|
}
|
|
221
223
|
}
|
|
222
|
-
const
|
|
224
|
+
const G = (e) => {
|
|
223
225
|
var t, n;
|
|
224
226
|
(n = (t = e.dom) == null ? void 0 : t.contentWindow) == null || n.postMessage(
|
|
225
227
|
{
|
|
@@ -234,13 +236,13 @@ const Q = (e) => {
|
|
|
234
236
|
},
|
|
235
237
|
"*"
|
|
236
238
|
);
|
|
237
|
-
},
|
|
238
|
-
window.addEventListener("message", (e) => {
|
|
239
|
+
}, Q = () => {
|
|
240
|
+
window[i.MICRO_TYPE] = "parent", window.addEventListener("message", (e) => {
|
|
239
241
|
if (e.data.cmd === "$xt/micro/sync") {
|
|
240
242
|
const t = [
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
243
|
+
i.IS_MICRO,
|
|
244
|
+
i.MICRO_NAME,
|
|
245
|
+
i.MICRO_TOKEN
|
|
244
246
|
], n = new URL(
|
|
245
247
|
window.decodeURIComponent(e.data.data.url),
|
|
246
248
|
e.origin
|
|
@@ -248,8 +250,8 @@ const Q = (e) => {
|
|
|
248
250
|
for (let a of t)
|
|
249
251
|
n.searchParams.delete(a);
|
|
250
252
|
const r = new URL(window.location.href);
|
|
251
|
-
r.searchParams.forEach((a,
|
|
252
|
-
|
|
253
|
+
r.searchParams.forEach((a, c) => {
|
|
254
|
+
c.startsWith(i.URL_PARAM_PREFIX) && r.searchParams.delete(c);
|
|
253
255
|
});
|
|
254
256
|
const o = C(
|
|
255
257
|
r.href,
|
|
@@ -258,7 +260,8 @@ const Q = (e) => {
|
|
|
258
260
|
);
|
|
259
261
|
window.history.replaceState(null, "", o);
|
|
260
262
|
} else if (e.data.cmd === "$xt/micro/info") {
|
|
261
|
-
|
|
263
|
+
console.debug("parent 「$xt/micro/info」 receive message", e.data);
|
|
264
|
+
const t = _(e.data.data);
|
|
262
265
|
e.source.postMessage(
|
|
263
266
|
{
|
|
264
267
|
cmd: "$xt/micro/info",
|
|
@@ -287,52 +290,55 @@ const Q = (e) => {
|
|
|
287
290
|
}
|
|
288
291
|
});
|
|
289
292
|
}, ie = (...t) => g(void 0, [...t], function* (e = {}) {
|
|
290
|
-
|
|
291
|
-
n
|
|
292
|
-
|
|
293
|
+
window[i.MICRO_TYPE] = "child";
|
|
294
|
+
const n = p(i.IS_MICRO), r = p(i.MICRO_NAME);
|
|
295
|
+
if (console.debug("child microInit", n, r), n && (window[i.IS_MICRO] = n === "true"), r && S(r).then((o) => {
|
|
296
|
+
window[i.MICRO_APP] = l({
|
|
293
297
|
microVersion: u
|
|
294
|
-
},
|
|
295
|
-
})
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
298
|
+
}, o);
|
|
299
|
+
}), window[i.IS_MICRO]) {
|
|
300
|
+
let o = function(c) {
|
|
301
|
+
var s = document.styleSheets[0];
|
|
302
|
+
if (!s) {
|
|
303
|
+
var d = document.createElement("style");
|
|
304
|
+
document.head.appendChild(d), s = d.sheet;
|
|
305
|
+
}
|
|
306
|
+
s.insertRule(c, s.cssRules.length);
|
|
307
|
+
};
|
|
308
|
+
window[i.IS_MICRO] && e.hideHeaderCssSelector && (Array.isArray(e.hideHeaderCssSelector) ? e.hideHeaderCssSelector.forEach((c) => {
|
|
309
|
+
o(`${c} { display: none !important; }`);
|
|
310
|
+
}) : o(
|
|
311
|
+
`${e.hideHeaderCssSelector} { display: none !important; }`
|
|
312
|
+
)), window.addEventListener("message", (c) => {
|
|
313
|
+
c.data.cmd === `$xt/micro/${r}` && R();
|
|
314
|
+
}), J(window);
|
|
315
|
+
const a = p(i.MICRO_TOKEN);
|
|
316
|
+
e.authHandler && a && (yield e.authHandler(a));
|
|
317
|
+
} else
|
|
318
|
+
console.warn("当前环境非微应用环境");
|
|
313
319
|
});
|
|
314
320
|
function J(e) {
|
|
315
321
|
const t = e.history, n = t.pushState, r = t.replaceState;
|
|
316
|
-
t.pushState = function(o, a,
|
|
317
|
-
const
|
|
322
|
+
t.pushState = function(o, a, c) {
|
|
323
|
+
const s = f(l(l({}, t.state || {}), o), {
|
|
318
324
|
// 添加新数据
|
|
319
325
|
_patchedByParent: !0
|
|
320
326
|
// 可选:标记这是被父窗口修改的状态
|
|
321
327
|
});
|
|
322
|
-
n.call(t,
|
|
323
|
-
}, t.replaceState = function(o, a,
|
|
324
|
-
const
|
|
328
|
+
n.call(t, s, a, c), R();
|
|
329
|
+
}, t.replaceState = function(o, a, c) {
|
|
330
|
+
const s = f(l(l({}, t.state || {}), o), {
|
|
325
331
|
// 添加新数据
|
|
326
332
|
_patchedByParent: !0
|
|
327
333
|
// 可选:标记这是被父窗口修改的状态
|
|
328
334
|
});
|
|
329
|
-
r.call(t,
|
|
335
|
+
r.call(t, s, a, c), R();
|
|
330
336
|
};
|
|
331
337
|
}
|
|
332
|
-
function
|
|
333
|
-
if (!window[
|
|
338
|
+
function R() {
|
|
339
|
+
if (!window[i.MICRO_APP])
|
|
334
340
|
return;
|
|
335
|
-
const { name: e, sync: t, mainBaseURL: n } = window[
|
|
341
|
+
const { name: e, sync: t, mainBaseURL: n } = window[i.MICRO_APP], r = window.location.pathname + window.location.search + window.location.hash;
|
|
336
342
|
window.parent.postMessage(
|
|
337
343
|
{
|
|
338
344
|
cmd: "$xt/micro/sync",
|
|
@@ -355,17 +361,17 @@ const Z = {
|
|
|
355
361
|
return;
|
|
356
362
|
}
|
|
357
363
|
const t = Object.assign({}, Z, e);
|
|
358
|
-
return w[e.name] = f(
|
|
359
|
-
instance: new
|
|
364
|
+
return w[e.name] = f(l({}, t), {
|
|
365
|
+
instance: new z(e)
|
|
360
366
|
}), w[e.name];
|
|
361
|
-
},
|
|
362
|
-
let o =
|
|
367
|
+
}, _ = (e) => w[e], ee = (e, t) => w[e.name] = l(l({}, e), t), te = (e, t) => new Promise((n, r) => {
|
|
368
|
+
let o = _(e);
|
|
363
369
|
o ? (t && (o.instance.changeOptions(t), o = ee(o, t)), o.preload ? o.instance.preloadRender(o.el) : o.instance.mount(o.el), n(o)) : r("app not found");
|
|
364
370
|
}), ne = (e) => {
|
|
365
|
-
let t =
|
|
371
|
+
let t = _(e);
|
|
366
372
|
t && t.instance.unmount();
|
|
367
|
-
},
|
|
368
|
-
let t =
|
|
373
|
+
}, de = (e) => {
|
|
374
|
+
let t = _(e);
|
|
369
375
|
t && t.instance.reload();
|
|
370
376
|
}, oe = /* @__PURE__ */ $({
|
|
371
377
|
__name: "XTMicroView",
|
|
@@ -392,18 +398,18 @@ const Z = {
|
|
|
392
398
|
}, o.$attrs, { class: "xt-micro" }), null, 16));
|
|
393
399
|
}
|
|
394
400
|
});
|
|
395
|
-
window[
|
|
396
|
-
const
|
|
401
|
+
window[i.MICRO_VERSION] = u;
|
|
402
|
+
const le = {
|
|
397
403
|
install: (e, t = {}) => {
|
|
398
|
-
e.component("xt-micro-view", oe),
|
|
404
|
+
e.component("xt-micro-view", oe), Q();
|
|
399
405
|
}
|
|
400
406
|
};
|
|
401
407
|
export {
|
|
402
408
|
oe as XTMicroView,
|
|
403
|
-
|
|
404
|
-
|
|
409
|
+
le as default,
|
|
410
|
+
_ as getApp,
|
|
405
411
|
ie as microInit,
|
|
406
|
-
|
|
412
|
+
de as reloadApp,
|
|
407
413
|
ce as setupApp,
|
|
408
414
|
te as startApp,
|
|
409
415
|
ne as stopApp,
|