[Bug]子项目使用异步组件的vue-router时，加载报错（添加script元素时无法找到qiankun-head元素）

[zhanghenryu]

问题描述

子项目，在vue-router中使用异步组件，加载时报错。

Uncaught runtime errors:
×
ERROR
Cannot read properties of null (reading 'contains')
TypeError: Cannot read properties of null (reading 'contains')
    at HTMLHeadElement.appendChildOrInsertBefore [as appendChild] (webpack-internal:///./node_modules/.pnpm/[email protected]/node_modules/qiankun/es/sandbox/patchers/dynamicAppend/common.js:247:44)
    at __webpack_require__.l (http://localhost:8081/js/app.js:557:41)
    at __webpack_require__.f.j (http://localhost:8081/js/app.js:1015:37)
    at eval (http://localhost:8081/js/app.js:464:40)
    at Array.reduce (<anonymous>)
    at __webpack_require__.e (http://localhost:8081/js/app.js:463:67)
    at fn.e (http://localhost:8081/js/app.js:655:50)
    at component (webpack-internal:///./src/router/index.ts:24:40)
    at extractComponentsGuards (webpack-internal:///./node_modules/.pnpm/[email protected][email protected]/node_modules/vue-router/dist/vue-router.esm-bundler.js:1844:32)
    at eval (webpack-internal:///./node_modules/.pnpm/[email protected][email protected]/node_modules/vue-router/dist/vue-router.esm-bundler.js:2813:16)

环境

platform: windows 10
node: 16.20.0
pnpm: 8.6.6
qiankun: 2.10.14
vue: 3.2.13
vue-router: 4.0.3

最小可复现程序

https://github.com/Zhang2Henry/qiankun-bug-report

复现步骤

1. 启动 sub 子项目
2. 启动 main 主项目
3. 访问 http://127.0.0.1:8080/#/bi/about 或者访问 http://127.0.0.1:8080/ 然后点击页面上“子应用about(动态)“菜单。

其他信息

已经初步调试过，是因为主应用的 appWrapper 中没有生成 < qiankun-head > 元素，导致子应用动态加载 script 时，没能找到 container。

[kuitos]

子应用 mount 写的有问题，注意看文档或者 demo
https://qiankun.umijs.org/zh/guide/getting-started#1-%E5%AF%BC%E5%87%BA%E7%9B%B8%E5%BA%94%E7%9A%84%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F%E9%92%A9%E5%AD%90

qiankun/examples/vue3/src/main.js

Line 24 in 46e4921

instance.mount(container ? container.querySelector('#app') : '#app');