唯品秀前端博客

qiankun孵化自蚂蚁金融科技基于微前端架构的云产品统一接入平台,一个基于single-spa的微前端实现库,旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。无法理解?说明当前公司背景环境用不上,直接略过

学习目标

本文通过一个传统cli搭建的vue2.x主应用去加载一个基于vite2 + vue3.x的子应用,然后跑起来,实现最基本的起手式操作

主应用

  • 利用vue脚手架创建一个vue2.0项目:qiankun-main,路由设置成history模式
  • 打开项目qiankun-main,安装qiankun(npm install qiankun --save)
  • 修改App.vue,新增一个VueChild的router-link,to值为“/vueChild”,并在router-view的下方新增一个id为vueContainer的div盒子(用于承载子应用)
  • 修改main.js,导入qiankun中的registerMicroApps和start两个方法,注册子应用并启动qiankun
::CODECOLORER_BLOCK_
剩余50%内容付费后可查看
本站所有文章、图片、资源等如无特殊说明或标注,均为来自互联网或者站长原创,版权归原作者所有;仅作为个人学习、研究以及欣赏!如若本站内容侵犯了原著者的合法权益,可联系我们进行处理,邮箱:343049466@qq.com
赞(0) 打赏

上一篇:

下一篇:

相关推荐

1 条评论关于"手把手教你基于微前端qiankun的应用实践(上篇)"

表情

最新评论

  1. Rose
    Windows 10 Chrome 104.0.0.0

    很强,主题已支持设置付费内容了

  2. 暂无留言哦~~
谢谢你请我吃鸡腿*^_^*

支付宝扫一扫打赏

微信扫一扫打赏