Implementation of Micro-Frontends with Qiankun in Live Streaming Platform

LOOK 直播运营后台是一个迭代了 2+ 年，累计超过 10+ 位开发者参与业务开发，页面数量多达 250+ 的“巨石应用”。代码量的庞大，带来了构建、部署的低效，此外该工程依赖内部的一套 Regularjs 技术栈也已经完成了历史使命，相应的 UI 组件库、工程脚手架也被推荐停止使用，走向了少维护或者不维护的阶段。因此，LOOK 直播运营后台基于 React 新建工程、做工程拆分被提上了工作日程。一句话描述目标就是：新的页面将在基于 React 的新工程开发， React 工程可以独立部署，而 LOOK 直播运营后台对外输出的访问地址期望维持不变。

本文基于 LOOK 直播运营后台的微前端落地实践总结而成。主要介绍在既有“巨石应用”、 Regularjs 和 React 技术栈共存的场景下，使用微前端框架 qiankun，实现 CMS 应用的微前端落地历程。

关于 qiankun 的介绍，请移步至官方查阅，本文不会侧重于介绍有关微前端的概念。

本文分为三部分：背景、实现、依赖共享。背景部分介绍了现有 CMS 应用的结构和目标；实现部分详细描述了主应用和子应用的搭建过程；依赖共享部分探讨了公共依赖的共享方案。

主应用（lookcms）的主要功能包括：请求权限和菜单数据、渲染菜单、启动 qiankun 并集成子应用。子应用（liveadmin 和 increase）通过生命周期钩子函数（bootstrap、mount、unmount）集成到主应用中。

部署方面，子应用和主应用分别独立部署，并处理跨域资源的问题。