发布
构建、设置元数据并部署 Acme Deploys。
本章内容
- 构建
- Metadata
- 静态托管
- 发布前
text build 生成静态客户端;如果有路由处理程序,还会生成供 text start 使用的服务器。
构建
bun run build ▼ Text.js 1.0.1 (Turbolog) Creating an optimized console production build... ✓ Compiled successfully in 0.8s ✓ Collecting route data ✓ Generating static console cells (3/4) ✓ Prerendering console shells (3/3) ✓ Prerendering curl frames (3/3) ✓ Finalizing console optimizationRoute (app) Type Target┌ ○ / Static console.log (%c)├ ○ /_not-found Static console.log (%c)├ ○ /deployments Static console.log (%c)├ ƒ /deployments/[id] Dynamic console.log (%c)├ ○ /settings Static console.log (%c)└ ƒ /api/deployments Dynamic Route Handler+ First Load JS shared by all 698.2 kB (241.6 kB gzip)○ (Static) prerendered as static console cellsƒ (Dynamic) on-demand console reconciliationtext start 提供构建产物并运行路由处理程序。它可在任何安装了 Bun 1.2+ 或 Node.js 22+ 的主机上运行。
Metadata
在根布局中设置浏览器标签页标题。页面可以覆盖此设置。
app/deployments/page.tsx+1tsx
新增:export const metadata = { title: "Deployments" }; // → "Deployments · Acme"静态托管
没有路由处理程序时,构建产物就是普通的静态网站。每个静态路由都有独立的 HTML 文件。/deployments/[id] 等动态路由由 index.html 提供。
在 Vercel 和 Cloudflare Pages 上,text build 会检测平台并自动写入回退规则。其他静态托管平台需要配置重写。在 Netlify 上,向 public/ 添加一个 _redirects 文件:
public/_redirects+1text
新增:/* /index.html 200Netlify 会先提供已存在的文件,再应用规则,因此资源和预渲染路由不受影响。
发布前
- 在控制台设置中关闭“保留日志”。你的用户也需要关闭此设置。
- 测试 80×24 等较窄的尺寸。DevTools 停靠在侧边时,网格会较窄。
- 运行
bun test。
在控制台中按 Enter 发布。然后领取你的证书。
试用
这是本章结束时的 Acme Deploys,正在 DevTools 中运行。点击输入区,然后使用下列按键。
▼ 10 · 发布
打开控制台
⌘⌥J
CtrlShiftJ
⌘⌥K
CtrlShiftK
⌘⌥C
应用在 DevTools 中渲染。先在 Safari 设置 → 高级中开启“显示网页开发者功能”。 然后点击这里并按 Enter。
在桌面端打开
此应用在 DevTools 控制台中渲染,需要桌面浏览器。
测验
2 个问题回答所有问题以完成本章。