构建与部署指南

Fluid for Astro 默认输出纯静态站点，构建命令只有一条：

npm run build

产物会生成在 dist/ 目录中，可以直接部署到任何支持静态文件的服务。

#本地预览

npm run build
npm run preview

preview 会以生产模式启动一个本地服务器，适合在部署前检查链接、RSS 与搜索索引。

#GitHub Pages

先设置站点地址。astro.config.mjs 会读取 siteConfig.url，因此只需要修改 src/config.ts：

export const siteConfig: SiteConfig = {
	// ...
	url: "https://<username>.github.io",
};

如果是项目仓库（https://<username>.github.io/<repository>/），再修改 astro.config.mjs 中的 basePath：

const basePath = "/<repository>/";

然后添加 GitHub Actions 工作流：

name: Deploy to GitHub Pages

on:
  push:
    branches: [main]

permissions:
  contents: read
  pages: write
  id-token: write

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: npm
      - run: npm ci
      - run: npm run build
      - uses: actions/upload-pages-artifact@v3
        with:
          path: dist

  deploy:
    needs: build
    runs-on: ubuntu-latest
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    steps:
      - id: deployment
        uses: actions/deploy-pages@v4

#Netlify

在 Netlify 新建站点并连接仓库，构建设置：

• Build command：npm run build
• Publish directory：dist
• Node version：20

如果需要，可以在仓库根目录添加 netlify.toml：

[build]
  command = "npm run build"
  publish = "dist"

[build.environment]
  NODE_VERSION = "20"

#Vercel

Vercel 会自动识别 Astro 项目，通常不需要额外配置。导入仓库后确认：

• Framework Preset：Astro
• Build Command：npm run build
• Output Directory：dist

#Cloudflare Pages

• Framework preset：Astro
• Build command：npm run build
• Build output directory：dist

#部署到子路径

如果站点部署在 https://example.com/blog/，需要同时修改：

// astro.config.mjs
base: "/blog/",

// src/config.ts
url: "https://example.com",

主题内部所有链接都会自动带上 BASE_URL，包括文章、分类、标签、分页、RSS 与搜索索引。

#自定义域名

部署完成后，在托管平台绑定域名，并把 siteConfig.url 更新为最终域名。这样 RSS、Sitemap、Canonical 与 Open Graph 中的链接才是正确的。

#构建检查清单

• siteConfig.url 是最终域名
• siteConfig.title、subtitle、author 已修改
• src/content/pages/about.md 已替换
• 头像、头图、favicon 已替换为本地图片
• 导航菜单与友链已更新
• 评论系统已配置并测试
• npm run build 无报错
• 访问 /rss.xml、/sitemap-index.xml、/search.json 正常

完成以上步骤后，你的博客就可以上线了。