1. 实践基于qiankun的微前端demo - 前言

❤️微前端是近两年前端社区非常热的一个话题，年前我偶然看到公众号推送的文章之后，对微前端产生了很浓的兴趣，最近在工作之余，搜罗了一些关于微前端的知识，进行了一点点实践，这里记录一下。

毕业设计的微服务

• 上图是去年毕业设计的时候，由于自己了解一点点后端的微服务（Spring Cloud），毕业设计的后端就采用了微服务架构，主要使用的就是Cloud的全家桶。
• 从分割线的上下就能看出来，前端是一个单体应用，而后端则是一堆应用，有教师、学生、编译、上传、导出、管理员等服务，是按业务进行拆分的，并使用eureka注册中心将这些服务凝聚在一起，前端访问的时候，好似就像后端是一个整体，但是他们内部的确是分的很详细。
• 这个时候，既然后端分成了一个个单独的小模块，但是前端还是一个大整体，好在现在的前端量不大，如果两年、三年都在开发同一个应用，前端页面达到几百个的时候，此时的前端应用就可以称作："巨石应用" 了，无论是打包还是日常开发，都是很不好的体验。

• 思考一下，如果前端按照后端的逻辑，按业务拆分成不同的项目，每个小前端项目对应不同的业务（或者有一个已经完成的系统，想集成到大的主系统内），最后再用一个类似eureka注册中心的东西将他们凝聚在一起，岂不美滋滋？带着这样的喜悦，我们继续往下看。

  
  
  理想中改造后的效果

• 微前端

贴一下微前端相关的一些知识
Michael Geers 微前端概念
single-spa

• qiankun （* i * * kun ）

qiankun是阿里巴巴基于single-spa实现的微前端库，介绍文档在这里qiankun的介绍文档，对于微前端的实践，这里采用该框架。

qiankun

你可以直接去qiankun的官网，风格和vue官网很像哈哈，进去后，选择“快速开始”，就可以简单的开始你的第一个微前端应用，这里我记录一下我的实现过程，可能有漏掉的步骤，大家可以及时反馈~

• 步骤
  大致有三步：
• 1. 创建我们的主应用，类似eureka注册中心，用于管理所有的子应用。
• 2. 创建我们的子应用one
• 3. 创建我们的子应用two
     ...
• 接下来，如果愿意看看究竟怎么实现，请继续看下去吧：
  2. 实践基于qiankun的微前端demo - 主项目