Single-spa ​

特点 ​

• 同一页面，不同框架，不用刷新页面
• 独立部署每一个单页面应用
• 新功能使用新框架，旧单页应用不用重写可以共存
• 改善初始加载时间，延迟加载代码

内容 ​

• app：每个应用都是完整的 SPA，可以响应 URL 路由事件，DOM 生命周期：初始化、挂载、卸载。没有各自的 HTML 页面
• config 配置：html 向程序注册
  • A name
  • A function（加载应用程序的代码）
  • A function （确定应用程序何时处于活动状态/非活动状态）

基本原理 ​

• portal 项目
• app 项目

Single-spa-test ​

jquery或以前老项目逐步迁移迭代方案

single-spa ​

微前端应用框架

使用其简单搭建出一个微前端架构

单页应用 ​

随着jquery老项目迁移到单页应用是需要迁移成本，使用微前端来逐步迁移是一种择优的方案

迁移步骤 ​

• 建立 single-spa-config 配置
• 创建需要迁移单页应用的页面 spa.html
• 单页应用的路由 base最好是设置成与老项目根目录同名 vue-template

项目地址： single-spa-test 效果地址：single-spa-test