diff --git a/dev/children/react16/src/index.js b/dev/children/react16/src/index.js index 472889198..a22229c6a 100644 --- a/dev/children/react16/src/index.js +++ b/dev/children/react16/src/index.js @@ -109,27 +109,27 @@ window.onunmount = () => { } /* ---------------------- 全局事件 --------------------- */ -document.addEventListener('click', function () { - console.log(`子应用${window.__MICRO_APP_NAME__}内部的document.addEventListener绑定`) -}, false) +// document.addEventListener('click', function () { +// console.log(`子应用${window.__MICRO_APP_NAME__}内部的document.addEventListener绑定`) +// }, false) -document.onclick = () => { - console.log(`子应用${window.__MICRO_APP_NAME__}内部的document.onclick绑定`) -} +// document.onclick = () => { +// console.log(`子应用${window.__MICRO_APP_NAME__}内部的document.onclick绑定`) +// } -window.addEventListener('click', () => { - console.log(`子应用${window.__MICRO_APP_NAME__}内部的window.addEventListener绑定`) -}, false) +// window.addEventListener('click', () => { +// console.log(`子应用${window.__MICRO_APP_NAME__}内部的window.addEventListener绑定`) +// }, false) /* ---------------------- 定时器 --------------------- */ -setInterval(() => { - console.log(`子应用${window.__MICRO_APP_NAME__}的setInterval`) -}, 5000) +// setInterval(() => { +// console.log(`子应用${window.__MICRO_APP_NAME__}的setInterval`) +// }, 5000) -setTimeout(() => { - console.log(`子应用${window.__MICRO_APP_NAME__}的setTimeout`) -}, 5000); +// setTimeout(() => { +// console.log(`子应用${window.__MICRO_APP_NAME__}的setTimeout`) +// }, 5000); /* ---------------------- 创建元素 --------------------- */ diff --git a/dev/children/react16/src/pages/page2/page2.js b/dev/children/react16/src/pages/page2/page2.js index eb3d9e15d..cace32984 100644 --- a/dev/children/react16/src/pages/page2/page2.js +++ b/dev/children/react16/src/pages/page2/page2.js @@ -25,13 +25,13 @@ import bigImg from '../../assets/big-img.jpeg'; // 测试umd二次渲染时全局变量是否丢失 window.umdGlobalKey = 'umdGlobalKey' -window.addEventListener('click', () => { - console.log('测试umd懒加载页面二次渲染全局事件 - window.click') -}) +// window.addEventListener('click', () => { +// console.log('测试umd懒加载页面二次渲染全局事件 - window.click') +// }) -document.addEventListener('click', () => { - console.log('测试umd懒加载页面二次渲染全局事件 - document.click') -}) +// document.addEventListener('click', () => { +// console.log('测试umd懒加载页面二次渲染全局事件 - document.click') +// }) window.microApp?.addDataListener((data) => { console.log('懒加载的数据监听', data) diff --git a/dev/children/react17/src/App.js b/dev/children/react17/src/App.js index b0fe9df60..605ce6b2f 100644 --- a/dev/children/react17/src/App.js +++ b/dev/children/react17/src/App.js @@ -1,4 +1,4 @@ -import React, { useState } from 'react' +import React from 'react' // import { Button, Drawer } from 'antd'; import logo from './logo.svg'; import './App.css'; diff --git a/dev/children/vite2/auto-imports.d.ts b/dev/children/vite2/auto-imports.d.ts index 918aad880..64342c652 100644 --- a/dev/children/vite2/auto-imports.d.ts +++ b/dev/children/vite2/auto-imports.d.ts @@ -4,5 +4,64 @@ // Generated by unplugin-auto-import export {} declare global { - + const EffectScope: typeof import('vue')['EffectScope'] + const computed: typeof import('vue')['computed'] + const createApp: typeof import('vue')['createApp'] + const customRef: typeof import('vue')['customRef'] + const defineAsyncComponent: typeof import('vue')['defineAsyncComponent'] + const defineComponent: typeof import('vue')['defineComponent'] + const effectScope: typeof import('vue')['effectScope'] + const getCurrentInstance: typeof import('vue')['getCurrentInstance'] + const getCurrentScope: typeof import('vue')['getCurrentScope'] + const h: typeof import('vue')['h'] + const inject: typeof import('vue')['inject'] + const isProxy: typeof import('vue')['isProxy'] + const isReactive: typeof import('vue')['isReactive'] + const isReadonly: typeof import('vue')['isReadonly'] + const isRef: typeof import('vue')['isRef'] + const markRaw: typeof import('vue')['markRaw'] + const nextTick: typeof import('vue')['nextTick'] + const onActivated: typeof import('vue')['onActivated'] + const onBeforeMount: typeof import('vue')['onBeforeMount'] + const onBeforeUnmount: typeof import('vue')['onBeforeUnmount'] + const onBeforeUpdate: typeof import('vue')['onBeforeUpdate'] + const onDeactivated: typeof import('vue')['onDeactivated'] + const onErrorCaptured: typeof import('vue')['onErrorCaptured'] + const onMounted: typeof import('vue')['onMounted'] + const onRenderTracked: typeof import('vue')['onRenderTracked'] + const onRenderTriggered: typeof import('vue')['onRenderTriggered'] + const onScopeDispose: typeof import('vue')['onScopeDispose'] + const onServerPrefetch: typeof import('vue')['onServerPrefetch'] + const onUnmounted: typeof import('vue')['onUnmounted'] + const onUpdated: typeof import('vue')['onUpdated'] + const provide: typeof import('vue')['provide'] + const reactive: typeof import('vue')['reactive'] + const readonly: typeof import('vue')['readonly'] + const ref: typeof import('vue')['ref'] + const resolveComponent: typeof import('vue')['resolveComponent'] + const shallowReactive: typeof import('vue')['shallowReactive'] + const shallowReadonly: typeof import('vue')['shallowReadonly'] + const shallowRef: typeof import('vue')['shallowRef'] + const toRaw: typeof import('vue')['toRaw'] + const toRef: typeof import('vue')['toRef'] + const toRefs: typeof import('vue')['toRefs'] + const triggerRef: typeof import('vue')['triggerRef'] + const unref: typeof import('vue')['unref'] + const useAttrs: typeof import('vue')['useAttrs'] + const useCssModule: typeof import('vue')['useCssModule'] + const useCssVars: typeof import('vue')['useCssVars'] + const useDialog: typeof import('naive-ui')['useDialog'] + const useLoadingBar: typeof import('naive-ui')['useLoadingBar'] + const useMessage: typeof import('naive-ui')['useMessage'] + const useNotification: typeof import('naive-ui')['useNotification'] + const useSlots: typeof import('vue')['useSlots'] + const watch: typeof import('vue')['watch'] + const watchEffect: typeof import('vue')['watchEffect'] + const watchPostEffect: typeof import('vue')['watchPostEffect'] + const watchSyncEffect: typeof import('vue')['watchSyncEffect'] +} +// for type re-export +declare global { + // @ts-ignore + export type { Component, ComponentPublicInstance, ComputedRef, InjectionKey, PropType, Ref, VNode } from 'vue' } diff --git a/dev/children/vite2/components.d.ts b/dev/children/vite2/components.d.ts index e156800fb..6efa3ee77 100644 --- a/dev/children/vite2/components.d.ts +++ b/dev/children/vite2/components.d.ts @@ -65,6 +65,8 @@ declare module '@vue/runtime-core' { ElTimePicker: typeof import('element-plus/es')['ElTimePicker'] ElTooltip: typeof import('element-plus/es')['ElTooltip'] HelloWorld: typeof import('./src/components/HelloWorld.vue')['default'] + NButton: typeof import('naive-ui')['NButton'] + NPopover: typeof import('naive-ui')['NPopover'] RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] } diff --git a/dev/children/vite2/package.json b/dev/children/vite2/package.json index 8c8c18c89..06be1ee3d 100644 --- a/dev/children/vite2/package.json +++ b/dev/children/vite2/package.json @@ -9,6 +9,7 @@ "dependencies": { "ant-design-vue": "^3.2.15", "element-plus": "^2.3.0", + "naive-ui": "^2.34.3", "vue": "^3.1.4", "vue-router": "^4.0.10" }, diff --git a/dev/children/vite2/vite.config.js b/dev/children/vite2/vite.config.js index 213400a5c..5dea49d87 100644 --- a/dev/children/vite2/vite.config.js +++ b/dev/children/vite2/vite.config.js @@ -3,7 +3,7 @@ import vue from '@vitejs/plugin-vue' // import legacy from '@vitejs/plugin-legacy' import AutoImport from 'unplugin-auto-import/vite' import Components from 'unplugin-vue-components/vite' -import { ElementPlusResolver, AntDesignVueResolver } from 'unplugin-vue-components/resolvers' +import { ElementPlusResolver, AntDesignVueResolver, NaiveUiResolver } from 'unplugin-vue-components/resolvers' import ElementPlus from 'unplugin-element-plus/vite' // https://vitejs.dev/config/ @@ -18,11 +18,23 @@ export default defineConfig({ ElementPlusResolver(), // AntDesignVueResolver(), // need it? ], + imports: [ + 'vue', + { + 'naive-ui': [ + 'useDialog', + 'useMessage', + 'useNotification', + 'useLoadingBar' + ] + } + ] }), Components({ resolvers: [ ElementPlusResolver(), AntDesignVueResolver(), + NaiveUiResolver(), ], }), ElementPlus() diff --git a/dev/children/vite2/yarn.lock b/dev/children/vite2/yarn.lock index 4dc6ea78b..2e6fe29da 100644 --- a/dev/children/vite2/yarn.lock +++ b/dev/children/vite2/yarn.lock @@ -44,6 +44,16 @@ resolved "https://registry.npmjs.org/@babel/standalone/-/standalone-7.19.5.tgz#9326980f3f0b13cfb6303906716a4a1ea2d670a2" integrity sha512-H2eXpo1ZfTZhBwsCbfSKHrjTb934laSas14hdjULLSKmLxU4B7kazQKm3mjpDuH/HyPmRq1cbrGL7223M7EDFw== +"@css-render/plugin-bem@^0.15.10": + version "0.15.12" + resolved "https://registry.npmjs.org/@css-render/plugin-bem/-/plugin-bem-0.15.12.tgz#cd88e46a388e4786436bd622414da0aa6019af3b" + integrity sha512-Lq2jSOZn+wYQtsyaFj6QRz2EzAnd3iW5fZeHO1WSXQdVYwvwGX0ZiH3X2JQgtgYLT1yeGtrwrqJdNdMEUD2xTw== + +"@css-render/vue3-ssr@^0.15.10": + version "0.15.12" + resolved "https://registry.npmjs.org/@css-render/vue3-ssr/-/vue3-ssr-0.15.12.tgz#798d8dffadecd2bf8c80cbaab64e9df10be5626e" + integrity sha512-AQLGhhaE0F+rwybRCkKUdzBdTEM/5PZBYy+fSYe1T9z9+yxMuV/k7ZRqa4M69X+EI1W8pa4kc9Iq2VjQkZx4rg== + "@ctrl/tinycolor@^3.4.0", "@ctrl/tinycolor@^3.4.1": version "3.6.0" resolved "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.6.0.tgz#53fa5fe9c34faee89469e48f91d51a3766108bc8" @@ -54,6 +64,11 @@ resolved "https://registry.npmjs.org/@element-plus/icons-vue/-/icons-vue-2.1.0.tgz#7ad90d08a8c0d5fd3af31c4f73264ca89614397a" integrity sha512-PSBn3elNoanENc1vnCfh+3WA9fimRC7n+fWkf3rE5jvv+aBohNHABC/KAR5KWPecxWxDTVT1ERpRbOMRcOV/vA== +"@emotion/hash@~0.8.0": + version "0.8.0" + resolved "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz#bbbff68978fefdbe68ccb533bc8cbe1d1afb5413" + integrity sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow== + "@esbuild/linux-loong64@0.14.54": version "0.14.54" resolved "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.14.54.tgz#de2a4be678bd4d0d1ffbb86e6de779cde5999028" @@ -76,6 +91,11 @@ resolved "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz#add4c98d341472a289190b424efbdb096991bb24" integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw== +"@juggle/resize-observer@^3.3.1": + version "3.4.0" + resolved "https://registry.npmjs.org/@juggle/resize-observer/-/resize-observer-3.4.0.tgz#08d6c5e20cf7e4cc02fd181c4b0c225cd31dbb60" + integrity sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA== + "@nodelib/fs.scandir@2.1.5": version "2.1.5" resolved "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5" @@ -124,6 +144,11 @@ resolved "https://registry.npmjs.org/@types/estree/-/estree-1.0.0.tgz#5fb2e536c1ae9bf35366eed879e827fa59ca41c2" integrity sha512-WulqXMDUTYAXCjZnk6JtIHPigp55cVtDgDrO2gHRwhyJto21+1zbVCtOYB2L1F9w4qCQ0rOGWBnBe0FNTiEJIQ== +"@types/katex@^0.14.0": + version "0.14.0" + resolved "https://registry.npmjs.org/@types/katex/-/katex-0.14.0.tgz#b84c0afc3218069a5ad64fe2a95321881021b5fe" + integrity sha512-+2FW2CcT0K3P+JMR8YG846bmDwplKUTsWgT2ENwdQ1UdVfRk3GQrh6Mi4sTopy30gI8Uau5CEqHTDZ6YvWIUPA== + "@types/lodash-es@^4.17.6": version "4.17.7" resolved "https://registry.npmjs.org/@types/lodash-es/-/lodash-es-4.17.7.tgz#22edcae9f44aff08546e71db8925f05b33c7cc40" @@ -131,7 +156,7 @@ dependencies: "@types/lodash" "*" -"@types/lodash@*", "@types/lodash@^4.14.182": +"@types/lodash@*", "@types/lodash@^4.14.181", "@types/lodash@^4.14.182": version "4.14.191" resolved "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.191.tgz#09511e7f7cba275acd8b419ddac8da9a6a79e2fa" integrity sha512-BdZ5BCCvho3EIXw6wUCXHe7rS53AIDPLE+JzwgT+OsJk53oBfbSmZZ7CX4VaRoN78N+TJpFi9QPlfIVNmJYWxQ== @@ -315,7 +340,7 @@ array-tree-filter@^2.1.0: resolved "https://registry.npmjs.org/array-tree-filter/-/array-tree-filter-2.1.0.tgz#873ac00fec83749f255ac8dd083814b4f6329190" integrity sha512-4ROwICNlNw/Hqa9v+rk5h22KjmzB1JGTMVKP2AKJBOCgb0yL0ASf0+YvCcLNNwquOHNX48jkeZIJ3a+oOQqKcw== -async-validator@^4.0.0, async-validator@^4.2.5: +async-validator@^4.0.0, async-validator@^4.0.7, async-validator@^4.2.5: version "4.2.5" resolved "https://registry.npmjs.org/async-validator/-/async-validator-4.2.5.tgz#c96ea3332a521699d0afaaceed510a54656c6339" integrity sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg== @@ -374,11 +399,34 @@ core-js@^3.22.3: resolved "https://registry.npmjs.org/core-js/-/core-js-3.25.5.tgz#e86f651a2ca8a0237a5f064c2fe56cef89646e27" integrity sha512-nbm6eZSjm+ZuBQxCUPQKQCoUEfFOXjUZ8dTTyikyKaWrTYmAVbykQfwsKE5dBK88u3QCkCrzsx/PPlKfhsvgpw== +css-render@^0.15.10: + version "0.15.12" + resolved "https://registry.npmjs.org/css-render/-/css-render-0.15.12.tgz#76be94066897bd3231a9b9412971ffc258ada66e" + integrity sha512-eWzS66patiGkTTik+ipO9qNGZ+uNuGyTmnz6/+EJIiFg8+3yZRpnMwgFo8YdXhQRsiePzehnusrxVvugNjXzbw== + dependencies: + "@emotion/hash" "~0.8.0" + csstype "~3.0.5" + csstype@^2.6.8: version "2.6.21" resolved "https://registry.npmjs.org/csstype/-/csstype-2.6.21.tgz#2efb85b7cc55c80017c66a5ad7cbd931fda3a90e" integrity sha512-Z1PhmomIfypOpoMjRQB70jfvy/wxT50qW08YXO5lMIJkrdq4yOTR+AW7FqutScmB9NkLwxo+jU+kZLbofZZq/w== +csstype@~3.0.5: + version "3.0.11" + resolved "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz#d66700c5eacfac1940deb4e3ee5642792d85cd33" + integrity sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw== + +date-fns-tz@^1.3.3: + version "1.3.8" + resolved "https://registry.npmjs.org/date-fns-tz/-/date-fns-tz-1.3.8.tgz#083e3a4e1f19b7857fa0c18deea6c2bc46ded7b9" + integrity sha512-qwNXUFtMHTTU6CFSFjoJ80W8Fzzp24LntbjFFBgL/faqds4e5mo9mftoRLgr3Vi1trISsg4awSpYVsOQCRnapQ== + +date-fns@^2.28.0: + version "2.29.3" + resolved "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz#27402d2fc67eb442b511b70bbdf98e6411cd68a8" + integrity sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA== + dayjs@^1.10.5, dayjs@^1.11.3: version "1.11.7" resolved "https://registry.npmjs.org/dayjs/-/dayjs-1.11.7.tgz#4b296922642f70999544d1144a2c25730fce63e2" @@ -569,6 +617,11 @@ estree-walker@^2.0.2: resolved "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz#52f010178c2a4c117a7757cfe942adb7d2da4cac" integrity sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w== +evtd@^0.2.2, evtd@^0.2.4: + version "0.2.4" + resolved "https://registry.npmjs.org/evtd/-/evtd-0.2.4.tgz#0aac39ba44d6926e6668948ac27618e0795b9d07" + integrity sha512-qaeGN5bx63s/AXgQo8gj6fBkxge+OoLddLniox5qtLAEY5HSnuSlISXVPxnSae1dWblvTh4/HoMIB+mbMsvZzw== + fast-glob@^3.2.12: version "3.2.12" resolved "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz#7f39ec99c2e6ab030337142da9e0c18f37afae80" @@ -618,6 +671,11 @@ has@^1.0.3: dependencies: function-bind "^1.1.1" +highlight.js@^11.5.0: + version "11.7.0" + resolved "https://registry.npmjs.org/highlight.js/-/highlight.js-11.7.0.tgz#3ff0165bc843f8c9bce1fd89e2fda9143d24b11e" + integrity sha512-1rRqesRFhMO/PRF+G86evnyJkCgaZFOI+Z6kdj15TA18funfoqJXvgPCLSf0SWq3SRfg1j3HlDs8o4s3EGq1oQ== + is-binary-path@~2.1.0: version "2.1.0" resolved "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz#ea1f7f3b80f064236e83470f86c09c254fb45b09" @@ -759,6 +817,30 @@ ms@2.1.2: resolved "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009" integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w== +naive-ui@^2.34.3: + version "2.34.3" + resolved "https://registry.npmjs.org/naive-ui/-/naive-ui-2.34.3.tgz#96fb0717aedd22b6943b947efc7f5cd58e9d29df" + integrity sha512-fUMr0dzb/iGsOTWgoblPVobY5X5dihQ1eam5dA+H74oyLYAvgX4pL96xQFPBLIYqvyRFBAsN85kHN5pLqdtpxA== + dependencies: + "@css-render/plugin-bem" "^0.15.10" + "@css-render/vue3-ssr" "^0.15.10" + "@types/katex" "^0.14.0" + "@types/lodash" "^4.14.181" + "@types/lodash-es" "^4.17.6" + async-validator "^4.0.7" + css-render "^0.15.10" + date-fns "^2.28.0" + date-fns-tz "^1.3.3" + evtd "^0.2.4" + highlight.js "^11.5.0" + lodash "^4.17.21" + lodash-es "^4.17.21" + seemly "^0.3.6" + treemate "^0.3.11" + vdirs "^0.1.8" + vooks "^0.2.12" + vueuc "^0.4.47" + nanoid@^3.3.4: version "3.3.4" resolved "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz#730b67e3cd09e2deacf03c027c81c9d9dbc5e8ab" @@ -884,6 +966,11 @@ scule@^1.0.0: resolved "https://registry.npmjs.org/scule/-/scule-1.0.0.tgz#895e6f4ba887e78d8b9b4111e23ae84fef82376d" integrity sha512-4AsO/FrViE/iDNEPaAQlb77tf0csuq27EsVpy6ett584EcRTp6pTDLoGWVxCD77y5iU5FauOvhsI4o1APwPoSQ== +seemly@^0.3.6: + version "0.3.6" + resolved "https://registry.npmjs.org/seemly/-/seemly-0.3.6.tgz#7ef97e8083dea00804965e2662f572a5df9cb18e" + integrity sha512-lEV5VB8BUKTo/AfktXJcy+JeXns26ylbMkIUco8CYREsQijuz4mrXres2Q+vMLdwkuLxJdIPQ8IlCIxLYm71Yw== + shallow-equal@^1.0.0: version "1.2.1" resolved "https://registry.npmjs.org/shallow-equal/-/shallow-equal-1.2.1.tgz#4c16abfa56043aa20d050324efa68940b0da79da" @@ -928,6 +1015,11 @@ to-regex-range@^5.0.1: dependencies: is-number "^7.0.0" +treemate@^0.3.11: + version "0.3.11" + resolved "https://registry.npmjs.org/treemate/-/treemate-0.3.11.tgz#7d52f8f69ab9ce326f8d139e0a3d1ffb25e48222" + integrity sha512-M8RGFoKtZ8dF+iwJfAJTOH/SM4KluKOKRJpjCMhI8bG3qB74zrFoArKZ62ll0Fr3mqkMJiQOmWYkdYgDeITYQg== + ufo@^1.1.1: version "1.1.1" resolved "https://registry.npmjs.org/ufo/-/ufo-1.1.1.tgz#e70265e7152f3aba425bd013d150b2cdf4056d7c" @@ -999,6 +1091,13 @@ unplugin@^1.1.0: webpack-sources "^3.2.3" webpack-virtual-modules "^0.5.0" +vdirs@^0.1.4, vdirs@^0.1.8: + version "0.1.8" + resolved "https://registry.npmjs.org/vdirs/-/vdirs-0.1.8.tgz#a103bc43baca738f8dea912a7e9737154a19dbc2" + integrity sha512-H9V1zGRLQZg9b+GdMk8MXDN2Lva0zx72MPahDKc30v+DtwKjfyOSXWRIX4t2mhDubM1H09gPhWeth/BJWPHGUw== + dependencies: + evtd "^0.2.2" + vite@^2.6.13: version "2.9.15" resolved "https://registry.npmjs.org/vite/-/vite-2.9.15.tgz#2858dd5b2be26aa394a283e62324281892546f0b" @@ -1011,6 +1110,13 @@ vite@^2.6.13: optionalDependencies: fsevents "~2.3.2" +vooks@^0.2.12, vooks@^0.2.4: + version "0.2.12" + resolved "https://registry.npmjs.org/vooks/-/vooks-0.2.12.tgz#2b6e23330b77bac81c7f7a344c4ca3e9f4f6c373" + integrity sha512-iox0I3RZzxtKlcgYaStQYKEzWWGAduMmq+jS7OrNdQo1FgGfPMubGL3uGHOU9n97NIvfFDBGnpSvkWyb/NSn/Q== + dependencies: + evtd "^0.2.2" + vue-demi@*: version "0.13.11" resolved "https://registry.npmjs.org/vue-demi/-/vue-demi-0.13.11.tgz#7d90369bdae8974d87b1973564ad390182410d99" @@ -1041,6 +1147,19 @@ vue@^3.1.4: "@vue/server-renderer" "3.2.40" "@vue/shared" "3.2.40" +vueuc@^0.4.47: + version "0.4.51" + resolved "https://registry.npmjs.org/vueuc/-/vueuc-0.4.51.tgz#35cd5364db4b71fc791a9823748711b91d910d49" + integrity sha512-pLiMChM4f+W8czlIClGvGBYo656lc2Y0/mXFSCydcSmnCR1izlKPGMgiYBGjbY9FDkFG8a2HEVz7t0DNzBWbDw== + dependencies: + "@css-render/vue3-ssr" "^0.15.10" + "@juggle/resize-observer" "^3.3.1" + css-render "^0.15.10" + evtd "^0.2.4" + seemly "^0.3.6" + vdirs "^0.1.4" + vooks "^0.2.4" + warning@^4.0.0: version "4.0.3" resolved "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3" diff --git a/dev/main-react16/src/global.jsx b/dev/main-react16/src/global.jsx index 6372ae0cd..6a1bf1581 100644 --- a/dev/main-react16/src/global.jsx +++ b/dev/main-react16/src/global.jsx @@ -73,12 +73,9 @@ microApp.start({ // prefetchLevel: 3, // prefetchDelay: 10000, // iframe: true, - getRootParentNode (node, appName) { - if (node) { - return node.rawParentNode - } - return document.body - }, + // getRootElementParentNode (node, appName) { + // return node.parentElement + // }, lifeCycles: { created (e) { console.log('created 全局监听', 'name:', e.detail.name) diff --git a/dev/main-react16/src/pages/react16/react16.js b/dev/main-react16/src/pages/react16/react16.js index 6f00baf9d..bb11c8ea4 100644 --- a/dev/main-react16/src/pages/react16/react16.js +++ b/dev/main-react16/src/pages/react16/react16.js @@ -424,7 +424,7 @@ export default class App extends React.Component { // fiber // ssr // clear-data - iframe + // iframe > ) diff --git a/dev/main-react16/src/pages/react17/react17.js b/dev/main-react16/src/pages/react17/react17.js index fa28ad0e0..72d68413c 100644 --- a/dev/main-react16/src/pages/react17/react17.js +++ b/dev/main-react16/src/pages/react17/react17.js @@ -37,6 +37,7 @@ function React17 () { // destroy // inline // keep-alive + // iframe /> ) diff --git a/src/libs/global_env.ts b/src/libs/global_env.ts index 551f185c3..1a2933622 100644 --- a/src/libs/global_env.ts +++ b/src/libs/global_env.ts @@ -29,7 +29,9 @@ declare global { interface Node { __MICRO_APP_NAME__?: string | null __PURE_ELEMENT__?: boolean + __MICRO_APP_HAS_DPN__?: boolean data?: unknown + rawParentNode?: ParentNode | null } interface HTMLStyleElement { diff --git a/src/libs/utils.ts b/src/libs/utils.ts index 79268e002..8974114b8 100644 --- a/src/libs/utils.ts +++ b/src/libs/utils.ts @@ -148,6 +148,10 @@ export function isBaseElement (target: unknown): target is HTMLBaseElement { return (target as HTMLBaseElement)?.tagName?.toUpperCase() === 'BASE' } +export function isMicroAppBody (target: unknown): target is HTMLElement { + return (target as HTMLElement)?.tagName?.toUpperCase() === 'MICRO-APP-BODY' +} + // is ProxyDocument export function isProxyDocument (target: unknown): target is Document { return toString.call(target) === '[object ProxyDocument]' diff --git a/src/sandbox/adapter.ts b/src/sandbox/adapter.ts index 70e70456f..4b68058d8 100644 --- a/src/sandbox/adapter.ts +++ b/src/sandbox/adapter.ts @@ -148,6 +148,7 @@ export function updateElementInfo (node: T, appName: string): T const proxyWindow = appInstanceMap.get(appName)?.sandBox?.proxyWindow if (proxyWindow && isNode(node) && !node.__MICRO_APP_NAME__) { // TODO: 测试baseURI和ownerDocument在with沙箱中是否正确 + // 经过验证with沙箱不能重写ownerDocument,否则react点击事件会触发两次 rawDefineProperties(node, { baseURI: { configurable: true, diff --git a/src/sandbox/iframe/element.ts b/src/sandbox/iframe/element.ts index 77e274c5c..4ef58f5ed 100644 --- a/src/sandbox/iframe/element.ts +++ b/src/sandbox/iframe/element.ts @@ -8,6 +8,7 @@ import { isScriptElement, isBaseElement, isElement, + isMicroAppBody, } from '../../libs/utils' import globalEnv from '../../libs/global_env' import { @@ -17,6 +18,7 @@ import { import { appInstanceMap, } from '../../create_app' +import microApp from '../../micro_app' export function patchIframeElement ( appName: string, @@ -152,8 +154,8 @@ function patchIframeNode ( * Will it cause other problems ? * e.g. target.parentNode.remove(target) */ - if (result?.tagName === 'MICRO-APP-BODY' && appInstanceMap.get(appName)?.container) { - return rawDocument.body + if (isMicroAppBody(result) && appInstanceMap.get(appName)?.container) { + return microApp.options.getRootElementParentNode?.(this, appName) || rawDocument.body } return result }, diff --git a/src/source/patch.ts b/src/source/patch.ts index afb9607fa..50cb13be0 100644 --- a/src/source/patch.ts +++ b/src/source/patch.ts @@ -1,5 +1,12 @@ -import type { Func, AppInterface, NormalKey } from '@micro-app/types' -import { appInstanceMap, isIframeSandbox } from '../create_app' +import type { + Func, + AppInterface, + NormalKey, +} from '@micro-app/types' +import { + appInstanceMap, + isIframeSandbox, +} from '../create_app' import { CompletionPath, getCurrentAppName, @@ -15,13 +22,18 @@ import { isElement, isNode, rawDefineProperty, + rawDefineProperties, isLinkElement, isStyleElement, isScriptElement, isIFrameElement, + isMicroAppBody, } from '../libs/utils' import scopedCSS from '../sandbox/scoped_css' -import { extractLinkFromHtml, formatDynamicLink } from './links' +import { + extractLinkFromHtml, + formatDynamicLink, +} from './links' import { extractScriptElement, runDynamicInlineScript, @@ -145,41 +157,35 @@ function invokePrototypeMethod ( * 1. element-ui@2/lib/utils/vue-popper.js * if (this.popperElm.parentNode === document.body) ... * WARNING: - * Will it cause other problems ? + * When operate child from parentNode async, may have been unmount * e.g. target.parentNode.remove(target) * ISSUE: * 1. https://github.com/micro-zoe/micro-app/issues/739 - */ - /** - * TODO: @ant-design/pro-components的drawer组件无法渲染 - * 问题:https://github.com/micro-zoe/micro-app/issues/739 - * 原因:拦截parentNode导致子应用的drawer组件判断错误,无法渲染 - * 补充: - * 1. iframe环境没问题 - * 难点: - * 1. 拦截micro-app-body下元素的parentNode是为了解决element-ui切换页面下拉框无法收起的问题, - * 解决思路: - * 1. 针对element-ui进行适配 - * 问题是如何确定只有那个组件才有这个问题 - * 2. 默认代理parentNode,并且在start中增加一个适配项,可以指定parentNode的值 + * Solution: Return the true value when node is not in document */ if ( !isIframeSandbox(app.name) && - hijackParent.tagName === 'MICRO-APP-BODY' && + isMicroAppBody(hijackParent) && rawMethod !== globalEnv.rawRemoveChild ) { const descriptor = Object.getOwnPropertyDescriptor(targetChild, 'parentNode') - if (!descriptor || descriptor.configurable) { - rawDefineProperty(targetChild, 'parentNode', { - configurable: true, - get () { - /** - * When operate child from parentNode async, may have been unmount - * e.g. - * target.parentNode.remove(target) - */ - return !app.container ? hijackParent : document.body + if ((!descriptor || descriptor.configurable) && !targetChild.__MICRO_APP_HAS_DPN__) { + rawDefineProperties(targetChild, { + parentNode: { + configurable: true, + get () { + const result = globalEnv.rawParentNodeDesc.get.call(this) + if (isMicroAppBody(result) && app.container) { + // TODO: remove getRootElementParentNode + return microApp.options.getRootElementParentNode?.(this, app.name) || document.body + } + return result + }, }, + __MICRO_APP_HAS_DPN__: { + configurable: true, + get: () => true, + } }) } } @@ -445,8 +451,8 @@ export function patchElementAndDocument (): void { // * BUG: // * 1. vue2 umdMode, throw error when render again (
will be deleted when render again ) // */ - // if (result?.tagName === 'MICRO-APP-BODY' && appInstanceMap.get(this.__MICRO_APP_NAME__)?.container) { - // return globalEnv.rawDocument.body + // if (isMicroAppBody(result) && appInstanceMap.get(this.__MICRO_APP_NAME__)?.container) { + // return document.body // } // return result // }, diff --git a/typings/global.d.ts b/typings/global.d.ts index 900aca4d6..f1fe556a2 100644 --- a/typings/global.d.ts +++ b/typings/global.d.ts @@ -348,6 +348,7 @@ declare module '@micro-app/types' { fetch?: fetchType globalAssets?: globalAssetsType, excludeAssetFilter?: (assetUrl: string) => boolean + getRootElementParentNode?: (node: Node, appName: AppName) => void } // MicroApp config