使用 Github Action 将 Gatsby 站点部署到 Github Pages

个人博客是基于 Gatsby 搭建的，之前已经利用 Github Action 部署在 Netlify 和 Vercel 上。本着不浪费 xxx.github.io 这个域。这次把 build 好的构建产物直接推到 gh-pages 分支

背景

由于 blog 源码和 构建产物可能不在同一个仓库，因此可能出现两种情形。

1.源码和构建产物共用一个仓库，分别对应不同的分支（master和gh-pages）

2.源码和构建产物分别在不同的仓库，分别对应不同仓库的不同分支的分支

- person-blog 的 master 对应blog源码

- xx.github.io 的 master 或者 gh-pages 对应源码的构建产物

情况一必须开源，情况二多了更多的可能，当然我是第二种情况

准备

1. 生成 access tokens

Tokens you have generated that can be used to access the GitHub API.

生成个人账号分配的 github api 权限列表的 token 待用。这里只生成了对开源仓库的操作权限

2. 在 xx.github.io 的 secret 中填入 acess token name对应secret name待用，value对应access token

3. 在源码仓库新建 github action 的 workflow

workflow

这里直接在GitHub Action Marketplace 市场中找到了 Gatsby Publish)，修改后的模板如下：

name: Gatsby Publish

on:
  push:
    branches:
      - master

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v1
      - uses: enriikke/gatsby-gh-pages-action@v2
        with:
          access-token: ${{ secrets.ACCESS_GITHUB_API_TOKEN }} // 自定义 scret name
          deploy-branch: master
          deploy-repo: shanejix.github.io // 注意这里直接是仓库名称

当然后续可以增加更多可定制的功能例如直接推到 gitee 或者 自己的服务器上