[求答疑] 主子应用均使用 vite 使用 loadMicroApp 无法同时加载多个子应用

[Soya-xy]

What happens?

主子应用均使用 vite 使用 loadMicroApp 无法同时加载多个子应用

访问路径

主应用/child/vms

复现代码

主应用中 vite-qiankun/main/src/pages/child/[...all].vue 同时加载多个子应用仅加载一个子应用

如果对每一个 loadMicroApp 使用 settimeout 等待上一个子应用加载完成后 在执行下一个 loadMicroApp 结果是正常的

 loadMicroApp({
    name: 'vms',
    entry: 'http://localhost:9090/admin/vms',
    container: '#container',
  })
  setTimeout(() => {
 loadMicroApp({
      name: 'power',
      entry: 'http://localhost:9091/admin/power',
      container: '#container2',
    })
  }, 1000)
  setTimeout(() => {
loadMicroApp({
      name: 'client',
      entry: 'http://localhost:3001/client/',
      container: '#container3',
    })
  }, 2000)

求解，是vite的原因还是其他原因，有没有方法可以达到像demo中vue2+webpack的同时加载多个子应用

Mini Showcase Repository(REQUIRED)

Provide a mini GitHub repository which can reproduce the issue. 复现库 https://github.com/Soya-xy/vite-qiankun

How To Reproduce

Steps to reproduce the behavior: 1. 2.

Expected behavior 1. 2.

Context

• qiankun Version:2.6.0
• Platform Version:
• Browser Version:

[gongshun]

是 vite 的原因，vue2+webpack 是正常的

[279zlj]

有不用定时器的解决方法么，还是得换webpack

[AlanFE01]

是 vite 的原因，vue2+webpack 是正常的

大佬有解决方案么？

[mzcc666GtHb]

大佬有解决方案吗,谢谢

[zijiaone]

大佬有解决方案了吗 ？

[teeeemoji]

有解决方案了, 问题原因比较复杂, 我分步骤讲一讲 ① import-html-entry 有问题: 在执行每个脚本前都会设置 window.proxy, 但是执行完成后没有还原; 正常情况下问题不大, 因为执行脚本前都会重置; ② vite-plugin-qiankun 插件生成的 index.html 非常规: 子应用的 JS 文件既不是直接内联的

import(xx.js) 是异步的 ,.finally() 也是异步的; 这个时候 import-html-entry 早就执行别的 script 去了 ③ 问题就发生在 vite-plugin-qiankun 生成的内联异步脚本里使用了 window.proxy

• vite-plugin-qiankun 生成的内联脚本执行同步执行没有问题, 异步脚本执行的时候 window.proxy 已经是其他子应用的 window.proxy 了

解决方案:

1. import-html-entry 无法考虑到同步脚本继续加载异步脚本的情况, import-html-entry 在同步脚本执行完成后还原 window.proxy 也无法解决问题
2. vite-plugin-qiankun 可以禁止在异步脚本内使用 window.proxy, 这一点解决起来非常简单 (vite-plugin-qiankun 异步脚本的代码不到 50 行, 可以自行修改)