说实话，微前端这个话题挺大的，咱就是说一篇文章Neng覆盖的知识点有限哈。

微前端是一种将前端单体应用拆分为多个可独立开发、独立部署、独立运行的子应用的架构模式。

你Ke以理解为项目geng加细粒度，每个模块douKe以自己开发和部署，符合咱高内聚、低耦合的期望。

微前端允许不同的团队独立开发和部署各自的功Neng模块，同时保持整个应用程序的一致性和协调性。

哈哈，这不就是咱梦寐以求的开发模式吗？你懂的。

这个问题啊，其实和微前端关系不大，但我顺便说说。百度收录问题通常和网站权重、内容质量、geng新频率等有关。

比如说你的网站内容不够丰富，或者geng新太慢，那百度蜘蛛可Neng就懒得来爬你的网站了。

JS 沙箱通过代理或快照机制隔离子应用对全局 window 的读写，防止全局变量污染。

class SnapshotSandbox { activate { this.windowSnapshot = {}; for { this.windowSnapshot = window; } } deactivate { for { if { window = this.windowSnapshot; } } }}

快照沙箱实现简单，但性Neng较差，且同一时刻只Neng运行一个子应用。

CSS 隔离主要为了防止子应用样式污染主应用或其他子应用，主要有三种方案：Shadow DOM、Scoped CSS 和动态样式表。

start;

Shadow DOM 提供Zui强的样式隔离，但挂载到 document.body 的弹窗、下拉菜单等组件会逃出 Shadow DOM 边界导致样式丢失。

子应用间的通信分为三种场景：主应用向子应用传递数据、子应用向主应用反馈、子应用之间互相通信。

// 主应用registerMicroApps => { /* 主应用处理登出逻辑 */ } }}]);

Zui简单直接的方式是通过 props 字段传入数据或回调函数，适合传递初始配置、用户信息等。

qiankun 是目前社区Zui成熟的微前端框架，基于 single-spa 封装，提供了完善的 JS 沙箱和 CSS 隔离机制。

适合场景： 大型单体应用拆分、企业级中后台系统等。

NPM 包方式属于构建时集成，优点是简单直接，TypeScript 支持好，但无法Zuo到真正的技术栈无关，也不Neng独立部署。

# 子应用发布为 npm 包npm publish @company/sub-app# 主应用安装依赖npm install @company/sub-app

Webpack 内置特性，支持在运行时跨应用共享模块，Ke以按模块粒度共享，避免重复加载公共依赖。

// 子应用 webpack.config.js —— 暴露模块new ModuleFederationPlugin; 来说微前端是一种非常灵活的前端架构模式，Ke以帮助我们geng好地应对复杂项目的开发和维护挑战。 当然它也带来了一些新的问题，比如应用间的样式冲突、消息通信等，但这些问题dou有相应的解决方案。 你kan，其实微前端也没那么难，就是需要我们多花点心思去理解和实践。害，不说了我去写代码了！