首页 > 其他 > 详细

qiankun 路由加载404 的情况及碰到的问题

时间:2021-09-11 11:26:14      阅读:187      评论:0      收藏:0      [点我收藏+]

qiankun 是一个基于 single-spa 的微前端实现库 官方文档 它的使用及介绍在官方有详细的文档说明,我这主要记录下 开发中遇到的问题,

1.关于 路由 加载404 的问题

使用component: ()=>import(‘../views/About‘)的方法来进行加载 会出现ChunkLoadError: Loading chunk 0 failed 打包后出现404的情况

//需要把 router push重写下
//处理 路由懒加载异常错误处理,
const originalPush = Router.prototype.push
Router.prototype.push = function push(originalPush) {
    console.log(originalPush)
    return originalPush.call(this, location).catch((err) => { return err })
}
2.子应用 处理 资源加载问题

子应用中新建 publicPath.js 在main.js 引入
publicPath.js

/**
 * 此路径非常重要,否则会出现子工程懒加载出现ChunkLoadError: Loading chunk 0 failed的错误
 * 还有,下面的注释不能删除
 */

import * as config from  ‘../vue.config‘  //获取devServer 的配置 便于统一
(function () {
  if (window.__POWERED_BY_QIANKUN__) {
	  //__POWERED_BY_QIANKUN__ 使用qiankun 初始化的属性
    if (process.env.NODE_ENV === ‘development‘) {
      // eslint-disable-next-line
      __webpack_public_path__ = `//localhost:${config.devServer.port}${config.publicPath}`
      return
    }
    // eslint-disable-next-line
    __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__
  }
})()

qiankun 路由加载404 的情况及碰到的问题

原文:https://www.cnblogs.com/zjxlicheng/p/15251284.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!