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

个人博客是基于 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 对应源码的构建产物

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

生成 access tokens

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

生成个人账号分配的 github api 权限列表的 token 待用。这里只生成了对开源仓库的操作权限
【使用|使用 Github Action 将 Gatsby 站点部署到 Github Pages】

文章图片

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

文章图片

在源码仓库新建 github action 的 workflow

文章图片

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

name: Gatsby Publishon: push: branches: - masterjobs: 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 或者自己的服务器上