qiankunli
qiankun实例化使用
一、qiankun使用场景 1. 简介：qiankun是在single-spa的基础上实现的，可以保证各个项目独立使用，也可以集成使用。各系统之间不受技术栈的限制，集成使用也能保证各样式和全局变量的隔离。 模块的插拔式使用，当公司项目集是一个大系统下包含多个子系统或者模块时，可以采用这种方式动态部署 ......
微前端 qiankun
三个项目，一个管理端，两个微前端 文档地址 https://qiankun.umijs.org/zh 普通项目管理端安装qiankun npm i qiankun -S 管理端main.js import Vue from 'vue' import App from './App.vue' Vue. ......
浅析微前端框架 qiankun 的实现
微前端简介 Techniques, strategies and recipes for building a modern web app with multiple teams that can ship features independently. -- Micro Frontends 前端 ......
qiankun微前端的简单使用
微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略。 微前端借鉴了微服务的架构理念，将一个庞大的前端应用拆分为多个独立灵活的小型应用，每个应用都可以独立开发、独立运行、独立部署，再将这些小型应用联合为一个完整的应用。微前端既可以将多个项目融合为一，又可以减少 ......
Linux2.1.13网络源代码学习(https://qiankunli.github.io/2022/07/04/linux_2_1_13_network.html)
简介 简介 源码目录 网络分层 数据结构 套接字 套接字与vfs sk_buff结构 网络协议栈实现——数据struct 和 协议struct linux1.2.13 接收数据 收到数据包的几种情况 Socket 读取 发送数据 面向过程/对象/ioc 以下来自linux1.2.13源码，算是参见L ......
聊聊 QianKun JS 沙箱的那些事
我们是袋鼠云数栈 UED 团队，致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神，探索前端道路，为社区积累并传播经验价值。 本文作者：空山 什么是沙箱 沙箱即 SandBox，它是一种安全机制，用于严格控制访问资源。通过在程序中创建一个独立的运行环境，把一些来源不可信、具有破坏力或者又是无法 ......
application 'vueApp' died in status NOT_MOUNTED: [qiankun]: Target container with #vue not existed after vueApp mounted!
这是第一次微前端很常见的提示，尤其是第一次写前端的时候碰到的 解决1：主应用的 App.vue标签上的id="app"去掉，这是报错的根本解决2： // 在子应用挂在的时候处理 function render(props = {}) { const { container } = props; in ......
微前端-qiankun（乾坤）入门（只针对vue + vue）
微前端现在主要以qiankun为主，网上有很多微前端的教学，但是很多啰嗦甚至没有讲到要点，逻辑顺序也很跳跃，对于想入门的同学来说学习时间过长，结合种种情况，我整理网上qiankun 中 vue的教学，从一个入门新生，怎么一步一步创建一个项目过程开始讲解。 一、首先什么是微前端（了解） 微前端就是将不 ......
qiankun框架父子服务之间的跳转出现undefined路由
近期想把自己的系统用微服务的方式实现下，过程中遇到一个问题，就是如果子应用不改变路由的情况下，主应用是可以正常切换的，但当子应用改变路由后，则路由报错，给出的错误原因是在路由前面增加了一个undefined 这个问题经过网上搜查资料发现是因为vue-router导致的 这里的currentLocat ......
vue3 webpack qiankun微前端
**qiankun: https://qiankun.umijs.org/zh/guide** **demo源码gitee：https://gitee.com/philippines-kisses-snow/qiankun-demo** > 官方对微应用的说明：通常这种场景下微应用是一个不带路由的可 ......
前端微应用框架(qiankun)调研
一、安装 1、主应用安装qiankun(子应用只做代码配置，无需任何安装) yarn add qiankun # 或者 npm i qiankun -S 二、关键参数介绍 1、主应用注册微应用 import { registerMicroApps, start, setDefaultMountApp ......
umi-qiankun——子应用vue+element返回主项目react+antdReact，样式丢失问题
参考： [Bug]结合 styled components 使用时 dynamicHeadAppend 存在缺陷 #617 https://github.com/umijs/qiankun/issues/617 qiankun官网 https://qiankun.umijs.org/zh/api/# ......
微前端框架哪个好？QianKun还是MicroApp
在当前云原生微服务、业务中台、低代码平台等IT架构下，不再是传统的烟囱式应用系统建设，而是打破企业业务部门竖井，建立企业级的信息化平台（数据中台、业务中台），那么对业务开发的解耦和聚合将成为关键技术，目前对于系统后端已有成熟的微服务架构，基于SpringBoot开发微服务，通过SpringCloud ......
qiankun微前端
qiankun 是一个基于 [single-spa](https://github.com/CanopyTax/single-spa) 的[微前端](https://micro-frontends.org/)实现库，旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。 微前端是一种多个团队通 ......
Qiankun
Qiankun是一个基于微前端的解决方案，但它并不是基于iframe的。Qiankun是基于浏览器新特性Web Components和Custom Elements实现的 它使用了Shadow DOM来隔离各个子应用的CSS和JavaScript，这样可以避免全局命名冲突。 它使用了HTML5的Hi ......
qiankun vue子应用升级webpack5问题记录
升级的方式是使用最新版本的 vue-cli 脚手架，重新创建一个新项目，然后复制 @vue/cli-xxx , vue 相关依赖最新版本到子应用项目 -> 核对babel, eslint相关配置的变化 -> 重新安装依赖，处理出现的相各种异常情况 -> 启动项目检查功能是否正常。 本次升级主要是为了 ......
vue主应用，qiankun 子应用切换主应用样式错乱问题
vue主应用，qiankun 子应用切换主应用样式错乱问题 const childRoute = ['/flinkdashboard', '/dolphinscheduler', '/datainsight' ] //子应用路径 const isChildRoute = (path) => chil ......
qiankun 框架是怎么做的样式隔离
Qiankun 是一个微前端框架，它在技术上采用了 Web Components 技术实现样式隔离。具体来说，Qiankun 利用 Shadow DOM 的特性，在应用程序容器中创建一个隔离的 DOM 树，使得每个子应用都可以拥有自己独立的样式作用域。 在 Qiankun 中，每个子应用都被封装为一 ......
qiankun 中使用Angular 实践
qiankun 中使用Angular 实践 最近把玩qiankun,基座跟微应用都是使用Angular,这两个应用都是放到docker 容器中，结果安装官方的配置后，拉起环境一路的坑。记录一二，防止后来者也入坑。先介绍一下环境的情况 mainapp Angular15, Docker 本机的4300 ......
微前端 - qiankun学习笔记
##前言 qiankun 是一个基于 single-spa 的微前端实现库，旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。 本文主要记录下如何接入 qiankun 微前端。主应用使用 vue2，子应用使用 vue3、react。 ###一、主应用 主应用不限技术栈，只需要提供一个容器 ......
qiankun的微应用如何调用主应用的工具类方法
以腾讯地图的搜索接口为例：https://apis.map.qq.com/ws/place/v1/suggestion 1、在主应用中定义一个工具类方法： 由于在vue中不能直接调用第三方的接口（因为跨域），除非后台做下处理，所以上面的方法引用了vue-jsonp这个插件来处理跨域 2、在主应用的入 ......
qiankun多重应用嵌套（父 --> 子 --> 孙）
父子孙应用路由都是使用的history模式 父应用配置： main.js import { registerMicroApps, start, initGlobalState } from 'qiankun' // 由于本身有window.__POWERED_BY_QIANKUN__参数，sub应用 ......