微应用有两种加载方式，一种是基于路由的加载方式，另外一种是基于手动的加载方式，这里我们使用第一种。 使用registerMicroApps进行配置。registerMicroApps(apps, lifeCycles?)接收两个参数，第一个必填项，填入微应用的注册信息。第二个为…

对于 qiankun 来说，路由劫持是在 single-spa 上去做的，而 qiankun 给我们提供的能力，主要便是子应用的加载和沙箱隔离。 我将分为三个 topic 去讲，这篇文章主要基于 qiankun 源码像大家讲一下微前端子应用的加载。 qiankun 是 sing…

1. 复用别的的项目页面 如果我们的项目需要开发某个新的功能，而这个功能另一个项目已经开发好，我们想直接复用时。PS：我们需要的只是别人项目的这个功能页面的内容部分，不需要别人项目的顶部导航和菜单。 一个比较笨的办法就是直接把别人项目这个页面的代码拷贝过来，但是万一别人不是 v…

本系列其他文章计划一到两个月内完成，点个 关注 不迷路。 本文是基于 qiankun 的微前端最佳实践系列文章之 从 0 到 1 篇，本文将分享如何使用 qiankun 如何搭建主应用基座，然后接入不同技术栈的微应用，完成微前端架构的从 0 到 1。 本教程采用 Vue 作为主…

假如你接手了一个技术栈又老体积又大而同时又不能停下进行更新迭代的项目，如果你要进行重构你会怎么办？微前端可以说是这个问题的满分答案。 总结：结合开头的问题，可知微前端是为了解决中后台项目随着迭代体积不断膨胀导致的各种问题（例如：部署，存储）。 NPM式：子工程以NPM包的形式发…

一、微前端由来随着前端历史化进程的推进，出现了两种前端开发模式，MPA多页面应用模式和SPA单页面应用模式，其分别有自己的独到之处以及不足点。（1）MPA模式例如中后台系统涵盖多个业务模块，分别由不同

1、需要全局安装 1 个包：express。 2、运行项目之前，先运行后端服务: node server.js or npm run server. 这样配置基本可以，但是main-vue + sub-umi项目却还是有问题，就是刷新浏览器之后，还是会报错。 main-umi …

qiankun 是蚂蚁金服开源的一套完整的微前端解决方案。具体描述可查看 文档 和 Github。 但是在实际的开发过程中，并非如此简单，同时还存在应用间跳转、应用间通信等问题。 代码、文章 持续更新中...

因为主项目和子项目都是用的 vue 开发，所以使用 vue-cli4 创建项目，创建 2 个项目，一个主项目，一个子项目。 下面正常开始编写项目，我之前也在网上看了好多 demo 和实际项目，大家主项目都是直接把乾坤的代码放在 main 里面。然后在 app.vue 中用 v-…