How To Use Github Action Publish A Gatsby Site To Github Pages

[shanejix]

同步链接: https://www.shanejix.com/posts/使用 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](Gatsby Publish · Actions · GitHub Marketplace)，修改后的模板如下：

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 或者 自己的服务器上

作者：shanejix
出处：https://www.shanejix.com/posts/使用 Github Action 将 Gatsby 站点部署到 Github Pages/
版权：本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。
声明：转载请注明出处！