微前端解决方案-qiankun实战及摆设

先来张图片压压惊

• subapp/micro-react
  
• subapp/micro-vue2
  
• subapp/micro-vue3
  

• 微前端是一种多个团队通过独立发布功能的方式来共同构建当代化 web 应用的技能本事及方法战略。
  
• 微前端架构具备以下几个核心价值：
  技能栈无关 : 主框架不限定接入应用的技能栈，微应用具备完全自主权
  独立开辟、独立摆设 : 微应用堆栈独立，前后端可独立开辟，摆设完成后主框架主动完成同步更新
  增量升级:在面临各种复杂场景时，我们通常很难对一个已经存在的体系做全量的技能栈升级或重构，而微前端是一种非常好的实行渐进式重构的本事和战略
  独立运行时 : 每个微应用之间状态隔离，运行时状态不共享
  
• 微前端架构旨在解决单体应用在一个相对长的时间跨度下，由于加入的职员、团队的增多、变迁，从一个寻常应用演变成一个巨石应用(Frontend Monolith)后，随之而来的应用不可维护的题目。这类题目在企业级 Web 应用中尤其常见。
  

• qiankun 是一个基于 single-spa 的微前端实现库，旨在资助各人能更简单、无痛的构建一个生产可用微前端架构体系。
  官网: https://qiankun.umijs.org/zh
  
• qiankun特性
  基于 single-spa 封装，提供了更加开箱即用的 API。
  技能栈无关，恣意技能栈的应用均可 使用/接入，岂论是 React/Vue/Angular/JQuery 还是其他等框架。
  HTML Entry 接入方式，让你接入微应用像使用 iframe 一样简单。
  样式隔离，确保微应用之间样式相互不干扰。
  JS 沙箱，确保微应用之间 全局变量/变乱 不辩说。
  ⚡️ 资源预加载，在欣赏器空闲时间预加载未打开的微应用资源，加快微应用打开速率。
  umi 插件，提供了 @umijs/plugin-qiankun 供 umi 应用一键切换成微前端架构体系。
  
• 相识完理论底子，让我们动手实践一下···
  

由于搭建项目太简单我就不阐明确 ~ ovo