部署到 GitHub Pages

使用 Folio、Vite 与 GitHub Actions 发布项目路径站点。

Tomz Dang约 1 分钟

Folio 把 GitHub Pages 项目路径当作一等部署场景。

官方站当前运行在:

https://uichat-mira.github.io/folio/

首次启用#

新仓第一次使用 Pages 时:

Settings → Pages → Build and deployment → Source → GitHub Actions

这是仓库级设置。默认 workflow GITHUB_TOKEN 的 pages: write 权限不能替代首次启用 Pages site。

Workflow#

checkout
→ setup Node
→ npm ci
→ build
→ configure-pages(仅 prod)
→ upload-pages-artifact(仅 prod)
→ deploy-pages(仅 prod)

仓库的 Pages 工作流在 dev、test、prod 的 PR 上构建;只有 prod 的 push 或手动运行会部署。workflow 级只读内容,部署 job 额外获得 Pages 权限:

permissions:
  contents: read

jobs:
  deploy:
    permissions:
      pages: write
      id-token: write

base path#

import { resolveGithubPagesBase } from "@uichat-mira/folio";

const base = resolveGithubPagesBase(process.env.GITHUB_REPOSITORY);

Folio 的 route、canonical、sitemap、robots 与 asset URL 都应使用同一个 Vite base。