使用 hugo 写博客的时候,每次增加文章,需要本地构建之后发布到 github 上通过 github pages 服务展示页面,不难想到可以使用 CI 的方法,将构建的过程自动化,实现写博文 push 到 github 即可自动构建并发布到 github pages。
搞的过程中坑比较多,记录为一个教程,供各位参考。
我折腾过程中的参考:https://tianhui.xin/blog/2019/11/17/hugousegithubactionstopages/
创建代码仓库和 github pages 仓库
构建过程中采用两个仓库:
- 代码仓库,github pages 在这里构建并发布,我们设为
username.github.io.source
- github pages 仓库,用于存放构建好的文件,github pages 服务会根据构建好的文件展示我们的博。客,我们设为
username.github.io
(username 改为你自己的 github username)
简单说来就是根据代码仓库的文件构建,构建好之后发布到 github pages 仓库,github pages 仓库由于有 github 提供的服务,会自动展示我们的 blog。
创建 github pages 仓库
没啥特别,github 上创建一个空仓库 username.github.io
创建代码仓库
这个仓库和我们本地直接关联,创建有一些细节需要注意,我下面的过程给各位参考:
github 创建空仓库
username.github.io.source
本地找个空文件夹,比如叫
HugoBlog
,进去之后初始化 Hugo Blog:hugo new site .
初始化 git 仓库:
git init
添加主题文件,这步需要注意,需要使用 git submodule 来进行(照着做就完了,不需要深入了解),比如我这边采用的主题文件为
joway/hugo-theme-yinyang
,那么命令为:git submodule add [email protected]:joway/hugo-theme-yinyang.git themes/yinyang
然后根据主题去配置去添加文章,用
hugo serve
看看效果,确定配置没问题然后是关键的一部,添加 workflows 文件,用于 github actions 构建。创建
.github/workflows/gh-pages.yml
文件,将下面的内容复制进去,并且根据自己的情况修改下面 TODO 表明的类。name: github pages CI # 自动化的名称,随便取 on: push: # push的时候触发 branches: - main # TODO 改成 username.github.io.source 的对应主分支 jobs: build: runs-on: ubuntu-latest steps: - name: checkout uses: actions/checkout@master with: submodules: true - name: Setup Hugo uses: peaceiris/actions-hugo@v2 with: hugo-version: '0.83.1' extended: true - name: Build run: hugo --minify - name: Deploy uses: peaceiris/actions-gh-pages@v3 with: deploy_key: ${{ secrets.ACTIONS_DEPLOY_KEY }} # 这个 ACTIONS_DEPLOY_KEY 需要注意,后面会用到 external_repository: username/username.github.io # TODO 改成对应的仓库名 publish_branch: main # TODO 发布到 username.github.io 的相应分支 publish_dir: ./public
需要知道的是,基本上最后搞不出来都会是因为这个文件,所以务必仔细检查配置,如果配置正确的情况下还是出现问题那么需要去看 hugo github actions 的提供方的文档,也就是 peaceiris/actions-gh-pages 这个项目。(我就是网上折腾了好久发现是配置不对 xD)
添加公钥和私钥。代码仓库需要有 github pages 的写入权限,需要添加公钥和私钥:(注意这个和 github 添加 ssh 链接的私钥不一样,无论如何都要做这一步)
- 使用
ssh-keygen -t rsa -b 4096 -C "$(git config user.email)"
创建公钥私钥,在当前文件夹生成即可: - 将生产后的私钥(不带后缀名的)添加到代码仓库,仓库的 Settings 中点击 Secrets,然后添加咱们刚刚生成的私钥,name 为 ACTIONS_DEPLOY_KEY,注意 name 一定要是这个,因为上面的文件中配置的是这个名字
- 然后将公钥(带 pub 后缀名的)添加到 github pages 仓库,Settings 中点击 Deploy keys,添加公钥,Allow write access一定要勾上,否则会无法提交
- 公钥和私钥可以删掉,后面不需要了
- 使用
将代码仓库 add commit push 到远程,基本操作,不多赘述
查看代码仓库的 actions,这个时候基本会 build 完成,如果失败了仔细检查步骤。
others
本次折腾过程中看到一些不了解的东西,打算去折腾一下:
- 非对称加密
- git submodule