# micro-web-react-base **Repository Path**: peryl/micro-web-react-base ## Basic Information - **Project Name**: micro-web-react-base - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 1 - **Forks**: 0 - **Created**: 2024-01-23 - **Last Updated**: 2025-06-09 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 微前端架构BASE工程 ## 子应用渲染的几种模式 ### render - 继承Base应用的组件上下文,所使用的基础依赖比如React,ReactDOM以及组件库都全部来自于Base应用,继承Base应用的组件上下文; - 子组件需要设置微前端配置microConfig中separate为空;这样主应用在加载子应用index config以及main config的时候就不会创建iframe来加载; - 优点是能完全使用Base应用所提供的组件以及工具函数; - 缺点是不可以隔离window全局变量以及样式; - 子应用在main init函数中通过调用setRender函数来控制渲染内容; ### custom - 设置microConfig 的separate为frame,主应用再加载子应用的index config以及main config的时候创建一个iframe来加载这些脚本; - 子应用自己挂载; - 优点是能完全隔离全局变量以及样式; - 缺点是不能完全使用主应用的所创建的组件以及工具函数,可以使用一些基础的依赖比如React,ReactDOM,Vue等等;组件库不可以共用同一个对象,但是子应用可以自己从Base应用的静态资源中加载一遍组件库依赖; - 子应用在main init函数中手动挂载内容,比如ReactDOM.createRoot来渲染子应用内容;