当前位置: 首页 > news >正文

qiankun+vite+vue3

基座与子应用代码示例

本示例中,基座为Vue3,子应用也是Vue3,由于qiankun不支持Vite构建的项目,这里还要引入

vite-plugin-qiankun 插件

基座(主应用)

加载qiankun依赖 

 npm i qiankun -S

qiankun配置(src/qiankun)

src/qiankun/config.ts

export default {subApps: [{name: 'sub-app', // 子应用名称,跟package.json一致entry: 'http://localhost:3001/sub-app/', // 子应用入口,本地环境下指定端口container: '#sub-container', // 挂载子应用的domactiveRule: '/sub-app', // 路由匹配规则props: {} // 主应用与子应用通信传值},]
}

 src/qiankun/index.ts

import { registerMicroApps, start } from 'qiankun'
import config from './config'const { subApps } = config// 注册子应用
export function registerApps() {try {registerMicroApps(subApps, {beforeLoad: [async app => {console.log('before load', app)}],beforeMount: [async app => {console.log('before mount', app)}],afterUnmount: [async app => {console.log('b
http://www.lryc.cn/news/524565.html

相关文章:

  • 【数据结构】顺序队列与链式队列
  • Cursor的详细使用指南
  • 2025美赛数学建模B题思路+模型+代码+论文
  • 2024年度总结-CSDN
  • 2024国游销量前20游戏分析:某开放世界武侠(排名11)
  • 如何使用python技术爬取下载百度文库文档?
  • navicat无法连接虚拟机的docker中的mysql
  • 如何使用CRM数据分析优化销售和客户关系?
  • 【Unity3D】3D物体摆放、场景优化案例Demo
  • 使用HTML5 Canvas 实现呼吸粒子球动画效果的原理
  • Java 中实体类与操作类分离
  • 【STM32HAL-----GPIO】
  • Java Web开发高级——单元测试与集成测试
  • 编译chromium笔记
  • Web开发 -前端部分-CSS3新特性
  • 【基础篇】什么是SQL注入,如何防止?
  • Swift语言的数据结构
  • 牛客周赛 Round 77
  • 浅谈云端编辑器,分析其亮点与不足
  • web应用引入cookie机制的用途和cookie技术主要包括的内容
  • 【HTML+CSS】使用HTML与后端技术连接数据库
  • 「2024·我的成长之路」:年终反思与展望
  • C#PaddleOCRSharp使用
  • 【Excel】【VBA】Reaction超限点筛选与散点图可视化
  • 京华春梦,守岁这方烟火人间
  • 学Python的人…
  • WebSocket 和 Socket 的区别
  • 学习ASP.NET Core的身份认证(基于JwtBearer的身份认证6)
  • 【SpringBoot】SpringBoot中分页插件(PageHelper)的使用
  • 【优选算法】4----盛最多水的容器