← 全部文章

把 Nuxt 站点部署到 Cloudflare Workers

从 build 到绑定 huozhe.me 自定义域名的完整步骤。

  • # Cloudflare
  • # Nuxt
  • # 部署

Cloudflare Workers 上可以运行 Node.js 兼容的完整 Nuxt 服务端渲染应用，而且全球边缘节点访问都很快。由于 Nuxt Content v3 使用 SQLite 存储文章索引，部署到 Cloudflare 时需要配一个 D1 数据库。

项目里已经做了什么

项目已经把 Nitro 预设配置为 Cloudflare Worker，Wrangler 配置会在构建时自动生成，无需手写 wrangler.jsonc：

// nuxt.config.ts
nitro: {
  preset: 'cloudflare_module',
  cloudflare: {
    deployConfig: true,
    wrangler: {
      name: 'huozhe-me',
      d1_databases: [
        {
          binding: 'DB',
          database_name: 'huozhe-me-content',
          database_id: '替换为真实 ID',
        },
      ],
    },
  },
}

创建 D1 数据库

npx wrangler d1 create huozhe-me-content

把输出的 database_id 填回 nuxt.config.ts，然后执行：

npm run deploy

这条命令会先构建 Nuxt（生成 .output/server/index.mjs 与 SQL 内容 dump），再用 Wrangler 部署到 Cloudflare。

构建产物位于 .output/：server/index.mjs 是 Worker 入口，public/ 是静态资源，.output/server/wrangler.json 是自动生成的部署配置。

本地开发不受影响

开发模式走本地 SQLite（better-sqlite3），只有生产构建与部署才会切到 D1：

npm run dev

绑定自定义域名

部署成功后，在 Cloudflare Dashboard 中打开 Worker 页面：

  1. 进入 Worker 的 Settings → Domains & Routes
  2. 点击 Add，选择 Custom Domain
  3. 输入 huozhe.me，按提示验证并保存
  4. 再添加一条 www.huozhe.me 指向同一个 Worker（可选）

前提是 huozhe.me 这个域名已经由 Cloudflare 托管（DNS 生效中）。