跳到正文
Lumo
工程约 1 分钟

部署

静态预渲染、Cloudflare Workers 静态资产、响应头、重定向与自定义域名。

更新于 2025年11月1日约 1 分钟编辑此页
本页目录

本站没有运行时服务器。react-router build 把每个路由预渲染到 build/client；Cloudflare Workers 把这些文件当作静态资产托管，只对未知 URL 回退到生成的 404.html。

构建#

本地验证bash
npm installnpm run typechecknpm run testnpm run buildnpm run preview   # Wrangler 托管 build/client

构建产物包含每个路由的 HTML，以及 React Router 用于客户端导航的 .data 文件。不要压平或重命名这些文件。

Cloudflare Workers#

  1. 1

    创建 Worker 项目

    在 Cloudflare 控制台的 Workers & Pages 中创建 Worker，导入本仓库。

  2. 2

    设置构建与部署

    构建命令 npm run typecheck && npm test && npm run build，部署命令 npx wrangler deploy，Node 22。

  3. 3

    任意域名都可用

    不需要构建变量：canonical、OG、JSON-LD 与 sitemap 的源会在边缘替换为请求域名，*.workers.dev、预览域名与自定义域名都能直接用。

  4. 4

    部署

    推送到 main，或在本地登录 Wrangler 后运行 npm run deploy。

wrangler.tomltoml
name = "lumo-website"main = "./src/worker.ts"compatibility_date = "2025-01-01" [assets]directory = "./build/client"binding = "ASSETS"html_handling = "auto-trailing-slash"not_found_handling = "404-page"run_worker_first = true

响应头与重定向#

文件作用
public/_headers安全响应头与不可变资源缓存。
404.html（构建生成）未知 URL 的品牌化 404 响应；已知路由由各自的 HTML 文件提供。
public/robots.txt爬虫策略与 sitemap 位置。
scripts/build-sitemap.mjs遍历预渲染 HTML 并写出 sitemap.xml。

顺序很重要

Workers 静态资产会先提供已存在的文件。如果某个路由 404，先确认它的预渲染 HTML 是否存在，再改 404 回退页。

自定义域名#

  1. 在 Worker → Settings → Domains & Routes 添加自定义域名，按提示配置 DNS。
  2. 换域名无需重新配置：canonical 与 sitemap 跟随请求域名。
  3. 在 Search Console 提交生成的 sitemap.xml。