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

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,originalPush,push,config,路由,加载
来源： https://www.cnblogs.com/zjxlicheng/p/15251284.html