准备生产版本
构建 WU workspace、提供 dist 输出,并在发布前检查微应用。
检查待发布内容
开发时验证的是源码。现在生成托管环境将提供的文件,并在浏览器检查构建版本。
继续在第一个微应用的 mi-plataforma/ 根目录操作。若完成添加第二个应用,也会构建 Vue。一或两个应用使用相同命令。
1. 构建 workspace
按 Ctrl+C 停止开发服务器,然后运行:
wu build
等待成功完成。WU 将 Astro shell 和微应用构建汇集到 workspace 根目录的 dist/。该目录包含完整输出,shell/dist/ 只包含 shell。
使用 React 和 Vue 时,确认 dist/index.html 存在,且每个微应用都有目录:
dist/
├── index.html
├── apps.json
├── wu-manifest.json
├── assets/...
├── mf-mi-plataforma/
│ ├── wu.json
│ └── assets/...
└── mf-inspector/
├── wu.json
└── assets/...
如果只创建 React,不会有 mf-inspector/。构建可能添加其他文件,包括 HTTP 策略文件。各 wu.json 指向其应用构建入口。
命令失败时,先解决首个错误再继续。以前构建的 dist/ 可能仍存在,磁盘上看到它不证明最近一次构建成功。
2. 提供构建输出
在同一根目录运行:
wu serve 4100
保持终端打开,访问 http://127.0.0.1:4100。4100 是本次检查端口;若被占用,选择其他数字并打开对应 URL。
wu serve 提供 dist/ 文件。修改源码后,必须重新执行 wu build,检查结果才会包含这些变更。
3. 检查生产应用
- 确认 Overview、Welcome to WU 和已创建的应用名称。
- 打开 mi-plataforma,检查 React、应用名称和计数器:+ 使 0 → 1,− 返回 0。
- 若添加了 Vue,打开 inspector 并重复计数器检查。
- 返回 Overview,刷新页面,再次打开应用。
- 检查浏览器开发工具中没有 JavaScript 加载错误或 404 响应。
这些操作验证 shell 能找到构建应用,且组件正常工作。开发可用而此处应用为空时,检查资源路径和 manifest;生产构建解释如何检查输出。
完成后按 Ctrl+C 停止服务器。
发布并继续学习
dist/ 汇总内容是托管发布产物。发布前,按照提供服务与部署检查目标环境路由、样式和响应头。端口 4100 的测试验证本地输出,部署后还需检查公开 URL。
wu doctor 提供额外诊断,与刚完成的交互检查互为补充。
要让这些应用共享行为,继续 React 与 Vue 共享计数器。随后可以添加带客户端、提供方和权限的应用间求和。两个示例包含全部文件以及开发和生产检查。如何运行示例还汇集实验室和 Node 示例。