当前位置: 首页 > 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

相关文章:

qiankun+vite+vue3

基座与子应用代码示例 本示例中,基座为Vue3,子应用也是Vue3,由于qiankun不支持Vite构建的项目,这里还要引入 vite-plugin-qiankun 插件 基座(主应用) 加载qiankun依赖 npm i qiankun -S qiankun配置(src/qiankun) src/qiankun/config.ts export default {subApp…...

【数据结构】顺序队列与链式队列

顺序队列与链式队列 1.队列的基本概念1.顺序存储的队列:循环队列3.链式存储的队列:链式队列 1.队列的基本概念 队列是一种逻辑结构,是一种特殊的线性表 只能在固定的两端操作线性表 只要满足上述条件,那么这种特殊的线性表就会…...

Cursor的详细使用指南

以下是一份关于 Cursor 的详细使用指南: 一、安装与设置 下载与安装: 首先,访问 Cursor 的官方网站,根据你的操作系统(Windows、Mac 或 Linux)下载相应的安装程序。运行安装程序,按照屏幕上的提…...

2025美赛数学建模B题思路+模型+代码+论文

2025美赛数学建模A题B题C题D题E题思路模型代码(1.24第一时间更新,更新见文末名片) 论文数学建模感想 纪念逝去的大学数学建模:两次校赛,两次国赛,两次美赛,一次电工杯。从大一下学期组队到现在…...

2024年度总结-CSDN

2024年CSDN年度总结 Author:OnceDay Date:2025年1月21日 一位热衷于Linux学习和开发的菜鸟,试图谱写一场冒险之旅,也许终点只是一场白日梦… 漫漫长路,有人对你微笑过嘛… 文章目录 2024年CSDN年度总结1. 整体回顾2…...

2024国游销量前20游戏分析:某开放世界武侠(排名11)

1、销量约20万套,销售额1400万人民币。 与一代的发售间隔为三年。 虽然对于网游大厂来说这个数字不够看,但对一个小团队来说足够维持了,三年的运营成本不是小数目。 2、开发商属于国内最早做3DMMO的厂商之一,创始人曾在国外大学…...

如何使用python技术爬取下载百度文库文档?

使用 Python 爬取百度文库文档需要通过分析网页结构和接口请求来实现。以下是一个基于搜索结果的实现方法,适用于爬取百度文库中的文档内容: 第一部分:获取百度文库文档 实现步骤 获取文档 ID 和基本信息 通过文档的 URL 获取文档 ID&…...

navicat无法连接虚拟机的docker中的mysql

我的数据库安装在了虚拟机的docker中,启动MySQL后,在主机上使用navicat一直连接不上。 首先确认密码是否有问题: docker exec -it mysql8 bash #进入mysql容器 mysql -u root -p #登录MySQL,我这边密码是123456 密码没问题的话…...

如何使用CRM数据分析优化销售和客户关系?

嘿,大家好!你有没有想过为什么有些公司在市场上如鱼得水,而另一些却在苦苦挣扎?答案可能就藏在他们的销售策略和客户关系管理(CRM)系统里。今天我们要聊的就是如何通过有效的 CRM 数据分析来提升你的销售额…...

【Unity3D】3D物体摆放、场景优化案例Demo

目录 PlaceManager.cs(放置管理类) Ground.cs(地板类) 和 GroundData.cs(地板数据类) 额外知识点说明 1、MeshFilter和MeshRenderer的Bounds区别 2、Gizmos 绘制一个平行于斜面的立方体 通过网盘分享的文件:PlaceGameDemo2.unitypackage 链接: https://pan.baid…...

使用HTML5 Canvas 实现呼吸粒子球动画效果的原理

在网页开发领域,动画效果能够极大地提升用户体验,让页面变得更加生动有趣。今天,我们深入剖析一个基于 HTML5 Canvas 的 3D 粒子动画 —— 呼吸粒子球。通过详细解读其代码实现,我们将全面了解如何运用 HTML5 的强大功能构建出如此…...

Java 中实体类与操作类分离

目录 一、为啥要把实体类和操作类分开 二、实体类长啥样,怎么用 三、操作类的使命与实现 四、实战演练:实体类与操作类协同工作 五、拓展思考:这种分离带来的好处与进一步优化 六、总结与展望 家人们,今天我想跟你们唠唠我在…...

【STM32HAL-----GPIO】

1. 什么是GPIO?(了解) 2. STM32 GPIO简介 2.1. GPIO特点 2.2. GPIO电气特性 2.3. GPIO引脚分布图 IO引脚分布特点:按组存在、组数视芯片而定、每组最多16个IO引脚。 3. IO端口基本结构介绍 4. GPIO八种工作模式 4.1. 输入浮空 特…...

Java Web开发高级——单元测试与集成测试

测试是软件开发的重要环节,确保代码质量和功能的正确性。在Spring Boot项目中,单元测试和集成测试是常用的两种测试类型: 单元测试:测试单个模块(如类或方法)是否按预期工作。集成测试:测试多个…...

编译chromium笔记

编译环境: windows10 powershell7.2.24 git 2.47.1 https://storage.googleapis.com/chrome-infra/depot_tools.zip 配置git git config --global user.name "John Doe" git config --global user.email "jdoegmail.com" git config --global …...

Web开发 -前端部分-CSS3新特性

1 CSS概述 2 CSS3私有前缀 3 CSS3的长度单位 代码实现&#xff1a; <!DOCTYPE html> <html lang"zh-CN"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"…...

【基础篇】什么是SQL注入,如何防止?

什么是 SQL 注入&#xff0c;如何防止&#xff1f; SQL 注入&#xff08;SQL Injection&#xff09;是一种常见的网络安全漏洞&#xff0c;它发生在 Web 应用程序中&#xff0c;当恶意用户在输入数据时&#xff0c;将恶意的 SQL 代码插入到输入中&#xff0c;从而导致应用程序…...

Swift语言的数据结构

Swift语言的数据结构 Swift是一种现代化的编程语言&#xff0c;它以安全性、性能和简洁性著称。尽管Swift通常被视为面向对象的语言&#xff0c;但它也支持函数式编程的特性&#xff0c;使得开发者可以以多种方式构建应用程序。在Swift中&#xff0c;数据结构是编程的基础&…...

牛客周赛 Round 77

题目链接&#xff1a;牛客周赛 Round 77 A. 时间表 tag&#xff1a;签到 B. 数独数组 tag&#xff1a;签到 Description&#xff1a;给定n个数&#xff0c;每个数的范围为1-9&#xff0c;问能否经过排列&#xff0c;使其每个长度为9的连续子数组都包含1-9这9个数字。 Sol…...

浅谈云端编辑器,分析其亮点与不足

浅谈云端编辑器&#xff0c;分析其亮点与不足 这个云端编辑器界面可以分为左侧题目筛选栏、中间题目描述与代码编辑区域、右侧AI提示功能三部分。以下是详细的分析&#xff1a; 1. 左侧题目筛选栏 层次结构清晰&#xff1a;左侧栏展示了一个层级结构&#xff0c;题目按主题分…...

科学发表的组学多面板图组装

摘要 高效的图件能清晰传达研究数据与结果&#xff0c;而组装用于科学发表的组学多面板图是项耗时且易出错的工作&#xff0c;往往需要专业的软件和操作技能&#xff0c;目前尚无&#xff11;款可快速高效组装复杂组学多面板图的专用工具。本研究开发了&#xff11;款操作友好…...

零基础玩转AI上色:cv_unet_image-colorization保姆级部署教程

零基础玩转AI上色&#xff1a;cv_unet_image-colorization保姆级部署教程 1. 工具简介与核心价值 黑白照片上色技术让历史影像重获新生&#xff0c;而cv_unet_image-colorization正是这样一款开箱即用的AI工具。基于ModelScope的UNet架构模型&#xff0c;它能够智能分析黑白照…...

效率提升秘籍:借助快马平台快速构建魔鬼面具图像滤镜应用

最近在做一个有趣的个人项目——魔鬼面具在线滤镜应用。作为一个前端开发者&#xff0c;我发现这类图像处理应用如果从零开始搭建会花费大量时间在基础框架上&#xff0c;而使用InsCode(快马)平台可以快速生成项目骨架&#xff0c;让我能专注于核心功能的实现。下面分享下我的开…...

如何用Listen1实现跨平台音乐播放?告别多平台切换的终极解决方案

如何用Listen1实现跨平台音乐播放&#xff1f;告别多平台切换的终极解决方案 【免费下载链接】listen1_chrome_extension one for all free music in china (chrome extension, also works for firefox) 项目地址: https://gitcode.com/gh_mirrors/li/listen1_chrome_extensi…...

AI Agent在保险行业的应用:风险评估、理赔自动化与客服

AI Agent在保险行业的应用&#xff1a;风险评估、理赔自动化与客服 核心概念 什么是AI Agent AI Agent&#xff08;人工智能代理&#xff09;并非一个全新的概念&#xff0c;但在大语言模型&#xff08;LLM&#xff0c;如GPT-4、Claude 3.5、通义千问、文心一言等&#xff09…...

三步解决华硕笔记本性能优化难题:G-Helper全方位调控指南

三步解决华硕笔记本性能优化难题&#xff1a;G-Helper全方位调控指南 【免费下载链接】g-helper Lightweight, open-source control tool for ASUS laptops and ROG Ally. Manage performance modes, fans, GPU, battery, and RGB lighting across Zephyrus, Flow, TUF, Strix,…...

告别PX4!用APM+Gazebo+SITL在Ubuntu 20.04上从零搭建无人机仿真环境(保姆级排坑实录)

告别PX4&#xff01;用APMGazeboSITL在Ubuntu 20.04上从零搭建无人机仿真环境&#xff08;保姆级排坑实录&#xff09; 当大多数无人机开发者还在PX4生态中挣扎于环境配置时&#xff0c;APM固件正以更轻量级的架构和灵活的扩展性悄然崛起。本文将带你跳出PX4的思维定式&#xf…...

HG-ha/MTools实操手册:利用开发辅助功能提高编码效率

HG-ha/MTools实操手册&#xff1a;利用开发辅助功能提高编码效率 1. 开箱即用的全能开发助手 你是不是经常在开发过程中遇到这样的困扰&#xff1a;需要频繁切换不同工具来处理图片、编辑音视频、调试代码&#xff1f;HG-ha/MTools 可能就是你要找的解决方案。 这是一款功能…...

别只盯着server.log了!Kafka Controller日志与GC日志里的“宝藏”与“陷阱”

别只盯着server.log了&#xff01;Kafka Controller日志与GC日志里的“宝藏”与“陷阱” 当Kafka集群出现Leader选举异常、副本同步缓慢或频繁Full GC时&#xff0c;大多数工程师的第一反应是打开server.log翻找线索。但真正的高手会告诉你&#xff1a;controller.log和GC日志才…...

Tsuru vs Kubernetes:容器化部署工具终极对比指南

Tsuru vs Kubernetes&#xff1a;容器化部署工具终极对比指南 【免费下载链接】tsuru Open source and extensible Platform as a Service (PaaS). 项目地址: https://gitcode.com/gh_mirrors/ts/tsuru 在当今云原生技术飞速发展的时代&#xff0c;选择合适的容器化部署…...