乾坤项目学习总结

什么是乾坤

通俗点讲乾坤就是在一个项目里面套另一个项目,一个项目在另一个项目框架里运行(有点像iframe了,为什么不用后面附官网);两个项目可以是不同的框架、技术实现,前者项目我们叫主应用,后者叫子应用,然后我们还需要创建一个微应用项目

主应用

1、安装qiankun依赖

复制代码
npm i qiankun -S

2、注册微应用

复制代码
import { registerMicroApps, start } from 'qiankun';

// 可以配置多个子应用
registerMicroApps([
  {
    name: 'reactApp', // 应用名称
    entry: '//localhost:3000', // 子应用地址(这里就需要一个动态环境变量地址,用于区分开发环境)
    container: '#container', // 子应用需要套在主应用哪里(这里表示id为container的标签下面)
    activeRule: '/app-vue/xx', // 主应用匹配规则(子应用路由后面的路径)
  }
]);
// 启动 qiankun
start();

微应用

然后就是微应用的一些配置了(不需要安装qiankun),具体配置就不写了,如果要调试子应用在主应用里面的效果(刚开始可以单独运行子应用进行开发调试,但后续还需要测试嵌套效果,肯定会存在一些bug),需要启动该项目。

附上乾坤官网地址入口,更多乾坤问题自行百度

相关推荐
持续前行6 小时前
vscode 中找settings.json 配置
前端·javascript·vue.js
JosieBook6 小时前
【Vue】11 Vue技术——Vue 中的事件处理详解
前端·javascript·vue.js
安逸点6 小时前
Vue项目中使用xlsx库解析Excel文件
vue.js
一只小阿乐6 小时前
vue 改变查询参数的值
前端·javascript·vue.js·路由·router·网文·未花中文网
小酒星小杜7 小时前
在AI时代下,技术人应该学会构建自己的反Demo地狱系统
前端·vue.js·ai编程
Code知行合壹7 小时前
Pinia入门
vue.js
今天也要晒太阳4737 小时前
element表单和vxe表单联动校验的实现
vue.js
依赖_赖8 小时前
前端实现token无感刷新
前端·javascript·vue.js
hhcccchh9 小时前
学习vue第十三天 Vue3组件深入指南:组件的艺术与科学
javascript·vue.js·学习
zhengxianyi5159 小时前
ruoyi-vue-pro本地环境搭建(超级详细,带异常处理)
前端·vue.js·前后端分离·ruoyi-vue-pro