为什么需要学习微前端？我们通过3w（what，why，how）的方式来讲解微前端

1、什么是微前端？

image.png

微前端就是将不同的功能按照不同的维度拆分成多个子应用，通过主应用来加载这些子应用
微前端的核心在于拆，拆完后再合。

2、为什么去使用微前端？

• 不同团队开发同一个应用技术栈不同怎么破？
• 希望每个团队都可以独立开发，独立部署怎么破？
• 项目中还需要老的应用代码怎么破？
  我们是不是可以将一个应用划分成若干个子应用，将子应用打包成一个个的lib，当路径切换时加载不同的子应用，这样每个子应用都是独立的，技术栈也不用做限制了！从而解决了前端协同开发问题

3、怎么落地微前端？

类似操作系统，会安装很多应用，每点一个功能就起一个应用。微前端相当于把前端页面用多个功能和服务进行安装。

2018年 Single-SPA 诞生了，Single-SPA 是一个用于微前端服务化的JS前端解决方案（本身没有出来样式隔离，js执行隔离）实现了路由劫持和应用加载
2019年 qianku 基于Single-SPA，提供了开箱即用的API（Single-SPA + sandbox + import-html-entry）做到了 技术栈无关、并且接入简单（像iframe 一样简单）

总结: 子应用可以独立构建，运行时动态加载主子应用，完全解耦，技术栈无关，靠的是协议接入（子应用必须导出bootstrap、mount、unmount方法）

nginx解决、iframe解决

这不就是iframe吗？
如果使用iframe中的子应用切换路由时，用户刷新页面之前的数据就丢了

应用通信：

• 基于URL来进行数据传递，但是传递消息能力弱
• 基于CustomEvent实现通信
• 基于props主子应用间通信
• 使用全局变量
• Redux进行通信

公共依赖：

• CDN extenals
• wepack 联邦模块