如何运行示例
测试 WU API、连接 React 与 Vue，并完整体验契约、RPC、权限和清理的服务流程。
也可以体验移动中的应用：React 编辑器、Vue 收件箱、窗口与 PiP、类型化传递、过渡和 keep-alive。场景指南介绍了如何将其用于你的应用。
选择要验证的内容
刚创建 mi-plataforma 并添加 inspector 时，先完成共享计数器，再完成应用间求和。两指南包含完整文件和 ZIP，可应用到同一个 workspace。之后可通过门户实验室探索更多场景。
| 流程 | 执行内容 | 入口 |
|---|---|---|
| 共享计数器 | 通过 store 连接 workspace 中 React 和 Vue 的计数器 | 指南与文件 |
| 应用间求和 | 添加带 RPC、manifests 和权限的客户端与提供方 | 指南与文件 |
| API 示例 | RPC、契约、grants、hooks、插件、timeline、同步和加载 | 实验室 |
| 组合 | React/Vue 挂载、共享计数器与事件发布 | React 与 Vue |
| 服务与 RPC | 契约消费、版本化请求、响应、取消和撤销 | 连接服务 |
| CLI 生成器 | 生成和复制命令，之后在终端执行 | 组合 |
| SSR、AI 与 MCP | Node 渲染、本地 actions，以及连接浏览器的 relay | 可下载示例 |
API 浏览器可在运行示例前查看签名、参数、返回值、错误、权限和清理。覆盖索引将目录的 397 条记录与可用示例关联，这些记录不代表框架测试覆盖率。
运行 API 示例
打开实验室，选择示例并运行。单纯选择不会启动工作。各项检查显示预期与实际结果，完成后也会报告资源清理。
八个示例包含 49 项检查。成功执行证明这些具体条件成立，不证明 API 的所有可能组合。
| 示例 | 可观察的操作 |
|---|---|
| RPC | handler 响应、不兼容范围、超时、中止信号和提供方移除 |
| 契约 | provide、consume、兼容版本访问、撤销和提供方替换 |
| Grants | manifest requests、shell grants、允许写入、拒绝，以及 unmount 后 facade 撤销 |
| Hooks | 优先级、next() 继续、取消及移除 guard 后挂载 |
| 插件 | 插件授权、事件接收和卸载时移除监听器 |
| Timeline | 变更记录、seek、返回实时状态，以及不会回退的副作用 |
| 同步 | 两个 store 通过 BroadcastChannel 交换真实消息，随后关闭通道 |
| 加载 | 策略、hints、本地模块加载、挂载、允许的 overrides 和缓存过期 |
可以分享带 ?recipe=rpc 或表内其他标识符的 URL。/labs/api/ 也提供同一实验室入口。显示代码来自项目固定示例，界面不求值访客输入的文本。
每次执行都会在当前文档中创建独立的 WU 实例。应用挂载到 Shadow DOM 内的元素；执行结束后，运行器释放自己的处理器、契约、监听器、通道和应用。取消、切换示例或移除组件都会请求中止和清理。如果清理未在规定时间内确认，执行回执会说明情况，诊断仍会显示待释放的资源。
从实验室到自己的代码
示例源码中的 h 是本门户的测试助手，不是从 wu-framework 导入。runner 创建该对象并传给示例函数。
| 示例中的写法 | 你的项目中 |
|---|---|
const { wu } = h |
在 shell 客户端模块中，从 wu-framework 导入 wu。 |
h.init(...) |
shell 使用真实目录调用 await wu.init({ apps, ... })。 |
h.app(nombre, grants) |
一个 apps 条目，包含 name、提供 wu.json 的 URL 和授予的 grants。 |
h.check / h.rejects |
测试检查；界面显示结果，或用 try/catch 处理错误。 |
h.defer |
注册测试清理；应用应保存取消函数，并在 unmount 中执行。 |
h.sleep / h.until |
测试场景的等待，不是 WU runtime 方法。 |
测试助手 (h) 和示例执行器链接可查看基础设施。Grants 中的应用 Manifest展示权限申请，可与代码的 granted 数组比较。应用申请写入 docs.api.*，但 shell 只授予 docs.api.allowed，所以写入 docs.api.denied 必须失败。
使用 RPC 的 Astro 页面
应用间求和把 7 + 8 = 15 带到你的 workspace：一个应用接收数字，另一个计算，Astro shell 授权并依序挂载。也包含停止提供方后的可恢复失败。
下载 wu-rpc-sum.zip，按指南先添加应用，再复制文件。ZIP 应用到 mi-plataforma/ 内，README 标明各目标。最终页面是 shell/src/pages/suma.astro。若已创建全部在宿主内执行的旧求和页，请用完整示例替换它。
各应用使用挂载时收到的 context.wu。manifests 申请权限，宿主授予权限。这样可以追踪完整的 cliente → request → handle del proveedor → respuesta，查看双方代码，并验证服务消失时的行为。
React 与 Vue 共享状态和事件
在组合中，shell 挂载两个 WU 应用。React 管理命令生成器，Vue 观察 store 和事件，视觉控件是 Lit Custom Elements。
- 点击从 React +1，Vue 检查器的值也通过 WU store 改变。
- 在 Vue 中增加或重置，React 收到新值。
- 在生成器修改名称和框架，点击发布到总线共享命令并产生检查器显示的事件。
- 在 Vue 点击暂停订阅，再从 React 增加。Store 改变，但检查器保持暂停观察。
- 重新连接后，Vue 再次读取当前值并注册订阅。
- 从应用栏卸载再重新挂载，观察生命周期和该实例资源移除。
计数器使用 docs.lab.counter，最后命令使用 docs.lab.lastCommand。事件是 docs:lab:counter、docs:lab:command 和 docs:lab:lifecycle。将模式用于自己的应用，请参阅状态、通信和生命周期。
复制按钮生成供终端使用的文本，门户不执行 WU CLI 二进制、不安装软件包，也不修改访客系统。创建真实 workspace 请按照第一个 workspace和 CLI 参考。
追踪应用间请求
打开服务与 RPC，观察客户端消费 docs:backend:service 并调用提供方发布的通道。
先发送含 name 和 entry 的 manifest，再移除 entry、请求不兼容版本或卸载提供方。这些情况分别展示服务拒绝数据、契约不满足版本范围，以及提供方不再可用。
慢速示例可在执行期间取消。提供方把 WU 信号连接到工作中断，仅停止客户端等待不足以保证停止。使用 WU 连接服务解释签名、grants、版本和清理。
运行 Node 示例
下载并解压 wu-server-recipes.zip。使用 Node 22.12 或更新版本，在解压目录运行：
npm install
npm test
npm run test:mcpnpm test 检查 SSR 和本地 actions。MCP 测试需要兼容浏览器，将 relay 进程连接到真实页面。按照 SSR和 AI/MCP准备要求并运行各场景。打开门户静态页面不会把这些示例变成 Node 服务。
版本与实现
首页示例、实验室和下载示例使用 WU Framework 4.0.0，终端指南使用 CLI 1.2.0。升级旧项目之前请阅读分发和迁移。
服务实现使用 Worker 和 WASI 程序，无需部署服务器即可在浏览器处理真实数据。这些基础设施位于 WU 提供方之后，使示例能够运行；学习的契约仍是 provide/consume、handle/request、权限和生命周期。它不向框架添加通用 WASI 引擎，也不替代 HTTP 监听器、Node SSR 或 MCP relay。