-
用
qiankun
来实现vue
技术栈和jeury技术栈的前端微服务main
是主项目是vue项目,app-vue-hash
是vue的hash
模式路由的子项目,app-vue-history
是vue的history
模式路由的子项目,app-jqery-*是传统的jquery的多页子项目 在主项目和子项目之间的数据通讯是基于vuex来做的,通讯范围也覆盖了jquery的项目 -
完成的功能,基于vuex实现各应用之间的响应式视图,有任意一个应用更新了视图,都会触发各个应用的视图更新
详细内容参见代码
-
qiankun
的开发和打包和正常模式一模一样,它使用一个全局变量__POWERED_BY_QIANKUN__
来区分微前端模式和正常模式,不需要额外的配置和代码。 -
整个项目的基础模板来自于https://github.com/gongshun/qiankun-vue-demo 感谢作者的辛苦产出!
-
具体的原理分析和介绍可以看:qiankun 微前端方案实践及总结 和 qiankun 微前端实践总结(二)
在根目录下:
1.先安装依赖: npm install
2.再执行npm run install-all
为所有项目安装依赖。
3.最后执行npm run start-all
即可启动所有的项目。
npm run build-all
可以打包所有的项目。