[qiankun] Target container with #container not existed while xxx loading!

最新推荐文章于 2024-12-12 15:03:56 发布

扒财

最新推荐文章于 2024-12-12 15:03:56 发布

阅读量3.7k

点赞数

文章标签：前端前端框架 vue.js

本文链接：https://blog.youkuaiyun.com/dalaojiyun/article/details/131804685

版权

文章描述了一个在使用Vue3和Qiankun微前端框架时遇到的问题，即页面刷新后报错‘ApplicationdiedinstatusNOT_MOUNTED’，意指子应用的容器未准备好。作者尝试了各种网上的解决方案，最后发现通过在主应用路由中添加一个404静态路由意外地解决了这个问题。这个非典型的解决方案可能并不常见，但对遇到相同问题的人来说可能是有效的。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如题如图：

`Application died in status NOT_MOUNTED: Target container with #container not existed while xxx loading!`

环境：

【vue3+qiankun】主应用 A 引用子应用 a1,a2,a3

问题：

点击路由切换时没有问题，每次刷新页面都会报“如图”的错误；字面意思是：qiankun加载完成了，但是子应用的容器还没准备好。

网上有很多说法和解决方法，但是好像每一种错误都对应一种或多种解决方法。严格来讲是每一种错误不同的人遇到所对应的解决方法也不一样。

所以，我的解决方法，也是非常神奇，误打误撞下解决了。

就是在主应用的路由里添加上一个404的静态路由，是不是有点扯，我也觉的。可是却是是解决了。

export const routes = [
  {
    path: '/:catchAll(.*)*',
    name: 'error',
    meta: {
      name: '404',
    },
    component: () => import('./404.vue'),
  }
]

仅供参考，千码千面。