qiankun(乾坤)微前端框架简介

qiankun(乾坤)微前端框架简介

最近在搞微前端项目,接下来整体介绍一下微前端。
在现代 Web 应用程序开发中,微前端架构逐渐成为一种趋势,它可以帮助我们更好地管理和组织复杂的项目。qiankun(乾坤)是一个基于 single-spa 的微前端实现库,旨在帮助开发者更简单、无痛地构建一个生产可用的微前端架构系统。
一、qiankun 简介

qiankun(乾坤)这个名字来源于“小世界有大乾坤”,意味着在微前端这个小世界里,通过乾坤这个框架可以创造出一个宏大的架构。qiankun 的主要特点有:

简单:无论你使用什么技术栈,都可以轻松地将子应用接入到主应用中,就像使用 iframe 一样简单。
完备:qiankun 提供了丰富的功能,包括样式隔离、沙箱、预加载等,为开发者解决微前端架构中的各种问题。
生产可用:qiankun 已经在蚂蚁金服内部和外部的 200+ 应用中得到验证,是一个值得信赖的生产可用解决方案。
二、qiankun 的设计理念

qiankun 的设计理念主要体现在两个方面:技术栈无关和技术栈无关。

技术栈无关:qiankun 不限制子应用的技术栈,无论是 React、Vue 还是 Angular,都可以轻松地接入到主应用中。这样可以消除应用之间的隐性依赖,实现真正的技术栈无关。
接入简单:qiankun 的目标是让接入微前端的过程就像使用 iframe 一样简单,从而尽可能减少对旧应用的改造工作量。
三、qiankun 的技术实现与选择

qiankun 在技术实现上主要解决了两个问题:应用的加载与切换和应用的隔离与通信。

应用的加载与切换:qiankun 通过使用 single-spa,实现了应用的懒加载、路由处理和应用入口选择等功能。
应用的隔离与通信:qiankun 使用 JS 沙箱和样式隔离技术,确保子应用之间的 JS 和 CSS 不会发生冲突。同时,qiankun 提供了父子应用和子子应用之间的通信机制,实现了应用之间的数据传递和交互。
总结

qiankun(乾坤)作为一个微前端框架,为开发者提供了简单、完备且生产可用的解决方案。通过技术栈无关和接入简单的设计理念,qiankun 可以帮助开发者更好地管理和组织复杂的 Web 应用程序,实现高效的协同开发

  • 10
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Qiankun 应用框架是一个基于前端架构的框架,它可以帮助开发者构建多个独立的应用,并能够将这些应用整合到一个主应用中。下面是 Qiankun 应用框架的简要介绍: 1. **前端架构**:Qiankun 应用框架采用前端架构,将主应用和子应用分开部署,每个子应用都有自己的独立代码库和运行环境。 2. **部署方式**:Qiankun 应用框架的部署方式是将每个子应用分别编译好,然后将主应用和子应用部署到 Nginx 配置好的目录中。 3. **代码库管理**:开发者可以分别进入 portal、app1、app2 等目录,执行相关命令来编译、打包、启动等操作。 4. **主应用引入子应用**:主应用可以通过引入 Qiankun 注册的子应用,并编写导航页显示跳转逻辑,来实现子应用的集成。 5. **跨域问题解决**:Qiankun 应用框架支持跨域配置,开发者可以在 Nginx 配置中设置相应的跨域规则,以解决跨域问题。 6. **JS变量隔离**:Qiankun 应用框架支持使用 JS Sandbox 技术来实现变量隔离。每个子应用都有自己的沙箱环境,可以避免不同子应用之间的变量冲突。 7. **子应用生命周期管理**:Qiankun 应用框架支持每个子应用的生命周期管理,可以根据需要定制子应用的启动、停止等操作。 总的来说,Qiankun 应用框架提供了一种简单、灵活的方式来构建多个独立的应用,并将其整合到一个主应用中。它可以帮助开发者更好地管理代码库、解决跨域问题、实现变量隔离等,从而提高开发效率和软件质量。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Shero.李建业

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值