generator 机制天然适合作为协程接口，通过 yield 显式交出控制权，由外部执行器统一管理子应用生命周期，实现可预测、可中断、可审计的跨应用异步协调。
Generator 机制本身不提供协程调度能力，但它天然适合作为“协程接口”——用 yield 显式交出控制权，把执行时机、错误流向、分支决策交给外部执行器统一管理。在微前端中，这恰好能解耦主应用与子应用的生命周期耦合，避免硬编码等待、轮询或事件监听，实现真正可预测、可中断、可审计的跨应用异步控制。
把子应用加载、挂载、卸载建模为 yieldable 单元
每个子应用的生命周期阶段（如 load、bootstrap、mount、unmount）都封装为返回 Promise 的函数，并统一作为 yield 表达式出现在 Generator 中。不直接调用，也不手动 .then；而是让执行器按需触发、捕获结果、决定下一步。
- 例如：
yield loadApp('cart')→ 执行器拿到 Promise，resolve 后传回 { status: 'success', instance: CartApp }，再自动调用next() - 失败时执行器可统一 throw 错误，由外层 try/catch 捕获，触发降级逻辑（如显示兜底页、切换备用子应用）
- 子应用若支持热更新，其 reload 接口也可 yield：
yield cartApp.reload()，保持语义一致
用 Generator 统一协调多子应用的并行/串行依赖
主应用常需按顺序启动核心子应用（如 auth → layout → dashboard），或并行加载非关键模块（如 analytics、chat）。Generator 可自然表达这种混合流程，无需额外状态机。
PigX UI 前端开发
下载
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
- 串行：依次 yield 多个子应用初始化函数，天然保证前序完成才进入后序
- 并行：
yield Promise.all([loadApp('header'), loadApp('sidebar')])，执行器自动等待全部 resolve，结果数组按序传入 next - 动态分支：
yield { type: 'role_gate', payload: userInfo }，执行器查权限表，决定 yield mountApp('admin-panel') 还是 mountApp('user-dashboard')
生命周期钩子注入与横切能力复用
微前端常需在所有子应用 mount 前注入全局样式、埋点 SDK、权限上下文。这些不该散落在各子应用内部，而应由主应用统一注入——Generator + 执行器正是理想载体。
- 执行器可在每次
next()前自动注入 traceId、timeout 控制、日志标记 - 例如：执行器拦截到
yield mountApp('order')，先执行injectAuthContext()和startTiming('order-mount')，再真正调用 mount - 所有子应用生命周期函数无需感知这些横切逻辑，保持纯净业务语义
轻量执行器适配不同微前端框架
不用引入 co 或 redux-saga 等重型方案。一个约 30 行的 runMicroLifecycle 执行器即可覆盖 qiankun、single-spa、micro-app 等主流框架：
- 接收 Generator 函数和初始参数（如 activeApps、baseRoute）
- 自动识别 yield 值类型：Promise → .then/.catch；对象 → 查路由映射表；数组 → 并行执行
- 对 callback 形式的老子应用（如 legacy AngularJS 子应用），用
yield new Promise(r => legacyBootstrap(cb => r(cb)))封装 - 暴露
abort()方法，支持用户跳转时主动中断未完成的 yield 链（如取消正在加载的报表子应用）
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
