乾坤（Qiankun）是一个微前端框架，它通过沙箱机制来隔离各个微应用，确保它们在同一个页面中不会相互干扰。以下是乾坤实现沙箱的主要技术和步骤：一、沙箱实现原理1. 全局变量隔离乾坤通过代理（Proxy）对象来拦截和管理全局变量（如 window 对象）的读写操作，从而实现全局变量的隔离。

一、背景：为什么需要微前端？前端代码已经变得越来越重：几个G的前端代码库数百号前端开发人员几MB的BundleSize也越来越复杂：层出不穷的框架、类库各式各样的工程化体系别具特色的跨端实践因而需要一种分解复杂度、提升协作效率、支持灵活扩展的架构模式，于是，微前端

本文中的微前端基于qiankun框架多个子应用共存如果需要多个子应用同时共存，在管理就有很多例子：https://qiankun.umijs.org/zh/faq#如何同时激活两个微应用registerMicroApps([//自定义activeRule{name:'reactApp',entry:'//localhost:7100',container,active

本地是vue环境，所以拿vue项目练习。1、创建一个父项目，两个子项目vuecreateparentvuecreatechildren-onevuecreatechildren-two2、打开主项目，引入qiankuncdparentnpmiqiankun-S这里我遇到了问题，PSC:\Users\admin\Desktop\qiankun\parent>npmiqiankun-Snpm

为什么需要CSS沙箱在qiankun微前端框架中，由于每个子应用的开发和部署都是独立的，将主/子应用的资源整合到一起时，容易出现样式冲突的问题因此，需要CSS沙箱来解决样式冲突问题，实现主应用以及各子应用之间的样式隔离，确保各自的样式独立运行，互不干扰工程化手段既然CSS沙箱是用

上篇文章（qiankun+vite+vue3从零搭建一个微前端架构系统）讲了如何从0搭建一个基于qiankun的微前端架构，这篇文章将探索一下主应用与微应用之间如何实现通信，代码是在上篇文章基础上改的。一、qiankun提供的initGlobalState方法1.initGlobalState简介在qiankun中，initGlo

本文将记录一下从零搭建一个微前端架构系统，技术栈使用qiankun+vite+vue3，后面还会持续分享主应用与微应用通信，组件共享，性能优化等内容。qiankun官网：介绍-qiankun参考网站：MicroFrontends一、微前端架构介绍微前端是一种多个团队通过独立发布功能的方式来共同构建现

运动器是一种可以控制单位或投射物按照期望路径进行移动的功能机制运动器提供了直线、追踪、环绕、曲线四种模式，并根据不同模式特征，开放了速度、加速度、高度、抛物线顶点高度等参数，可以实现多种表现需求运动器可以设置碰撞数据，并在碰撞到单位、地形时触发回调，可以实现多种技

在软件开发中，特别是在使用动态链接库（DLL）的Windows环境下，"导入"（Import）和"导出"（Export）是两个关键概念，用于管理函数和变量在DLL之间的可见性和可用性。导出 (Export)当你创建一个DLL时，你可能会希望在这个DLL中定义一些函数或变量，使得其他的程序（客户端程序）或者其他的DLL能够调用或

声明！        学习视频来自B站up主**泷羽sec**有兴趣的师傅可以关注一下，如涉及侵权马上删除文章，笔记只是方便各位师傅的学习和探讨，文章所提到的网站以及内容，只做学习交流，其他均与本人以及泷羽sec团队无关，切勿触碰法律底线，否则后果自负！！！！有兴趣的小伙伴可以点击下面连

前言：qiankun官网qiankun(乾坤)微应用框架。可以让很多应用集成到一个项目里来。但集成时样式隔离是个很大的问题（坑）。官网也给出了一些解决方案。虽然无界完美的解决了样式隔离的问题（它的底层使用iframe实现的），同样它也有其他缺点：无界官网qiankun也给了为什么不用ifr

qiankun是single-spa二开；使用场景：不同技术栈，不同团队，独立开发部署、增量升级；总结：解耦；        主应用:具有整合-输入子应用的html入口；子应用  与single-spa基本一致，导出了三个生命周期函数 (bootstrapmountunmout)js沙箱:三个沙箱（快照沙箱、

一：Vue2改造主应用创建方式：vuecreatevue2-master 1:在vue2项目src下撞见qiankun文件夹用于注册和启动子应用配置创建index.js创建app.js。注册。name要和子应用vite.config.js配置相同。container要和indexView中id相同创建indexView.vue。用于显示微应用

title:Vue微前端架构与Qiankun实践理论指南date:2024/6/15updated:2024/6/15author:cmdragonexcerpt:这篇文章介绍了微前端架构概念，聚焦于如何在Vue.js项目中应用Qiankun框架实现模块化和组件化，以达到高效开发和维护的目的。讨论了Qiankun的原理、如何设置主应

title:Vue微前端架构与Qiankun实践理论指南date:2024/6/15updated:2024/6/15author:cmdragonexcerpt:这篇文章介绍了微前端架构概念，聚焦于如何在Vue.js项目中应用Qiankun框架实现模块化和组件化，以达到高效开发和维护的目的。讨论了Qiankun的原理、如何设置主应用与子

前一篇文章讲了qiankun集成vue子应用，这篇随笔讲集成react子应用。1、创建react子应用用react脚手架初始化一个react项目，至于项目的数据仓库store和路由、以及UI组件库这里就不做讲解，可以自己自行网上找资料配置。create-react-appmy-react-app2、在src路径下创建publicPat

一、背景‘熵增’问题一直是所有软件开发中都会遇到的问题，不管是前端还是后端都会遇到，老的系统在需求不断变更或者迭代，代码量会越来越大，最终都会形成一座‘屎山’，今天主要讨论前端对于这种情况的解决方案。目前前端的解决方案有比较古老的iframe，但是iframe是完全隔绝了

概论主要是有一个微前端的主权项目，实现对微服务的调用，类似iframe显示，父应用和子应用可以通过一些数据通信方式实现数据通信。代码微前端注册importVuefrom'vue'importAppfrom'./App.vue'import{registerMicroApps,start,setDefaultMountApp}from'qiankun'im

微前端用通俗易懂的话来说就是：一个主应用（基座）中可以搭建多个子应用（微应用），这些子应用可以是不同版本，不同前端框架，而且跟主应用的语言无关，主应用仅仅是一个基座。正常一个项目想要展示另一个项目，通常会用iframe进行嵌入，但是相比iframe，qiankun等微前端的接入表现形式会更加友好，

为什么要有js资源隔离机制？主应用和子应用，相同的全局变量，可能会发生冲突，子应用和子应用之间，相同的全局变量，也可能会发生冲突。在这里我们主要指的就是window。思路：打开沙箱时能够修改属性值；关闭沙箱时恢复未开启沙箱前的属性值，并且要记录修改了哪些属性。qiankun.js隔离机制Sn

本文将针对微前端框架qiankun的源码进行深入解析，在源码讲解之前，我们先来了解一下什么是微前端。微前端是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将单页面前端应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用还可以独立开发、独立

子应用主应用间如何通信qiankun官方提供了actions通信，qiankun内部使用initGlobalState(state)定义全局状态，该方法执行后返回一个MicroAppStateActions实例，实例中包含三个方法，分别是onGlobalStateChange、setGlobalState、offGlobalStateChange。MicroAppStateActionsonGlob

 废话不多说先了解下在实践。1.什么是微前端web应用构建方式微前端 微前端在2016年ThoughtWorksTechnologyRadar正式被提出。微服务这个被广泛应用于服务端的技术范式扩展到前端领域。现代的前端应用的发展趋势正在变得越来越富功能化，富交互化，也就是SPA应用；这样越来越