我这里是按照Jared.Tan在知乎上的文章折腾Hugo | GitHub Pages | Github Actions自动构建发布免费个人网站来实现的,在这里自己做一下整理。

1、创建仓库

  • 创建源码仓库example.github.io.source,并设置为Private
  • 创建网站仓库example.github.io

2、绑定SSH Key

GitHub Actions在编译生成静态文件并通过Git Push到网站仓库example.github.io时需要Git账户认证。

  • 生成一对ssh key

    1
    
    $ ssh-keygen -t rsa -C "your_email@youremail.com"
    

    在输入路径时我们自定义一个路径防止影响到原来的ssh key。

  • 添加Public Key到example.github.io仓库

    按照生成ssh key的路径打开.ssh.pub文件并复制里面的内容,在example.github.io仓库SettingsDeploy keys在里面点击新增后粘贴,要注意勾选Allow write access

  • 添加Private Key到example.github.io.source仓库

    按照生成ssh key的路径打开.ssh文件并复制里面的内容,在example.github.io.source仓库

    SettingsSecrets添加一个新的secret后粘贴,这里的名称一定要用ACTIONS_DEPLOY_KEY,在后面的Ation会用到。

3、将源码推送到仓库

这里我们用Hugo创建一个个人网站,在用hugo server命令预览网站没有问题之后,使用git push命令推送源码到example.github.io.source仓库。

4、配置GitHub Actions

example.github.io.source仓库的Actions点击New workflow,然后按照要求修改下面的文件粘贴进去:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
name: Deploy Hugo Site to Github Pages on Master Branch

on:
  push:
    branches:
      - master

jobs:
  build-deploy:
    runs-on: ubuntu-18.04
    steps:
      - uses: actions/checkout@v1  # v2 does not have submodules option now
       # with:
       #   submodules: true

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: '0.62.2'   # 这里的版本号要与你安装的版本号一致
          # 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 则是上面设置 Private Key的变量名
          external_repository: JaredTan95/JaredTan95.github.io # Pages 远程仓库 
          publish_dir: "./public"
          cname: www.example.com     # 如果没有cname请删除
          keep_files: false # remove existing files
          publish_branch: master  # deploying branch
          commit_message: ${{ github.event.head_commit.message }}

然后右上角提交commit就可以了。

出发之后我们每次出发之后的状态,点进去之后我们可以看到流水线日志,都是绿色对号就可以了。如果Actions运行有问题,我们会受到邮件提醒。

Actions

5、设置.gitignore文件

在实际的使用中我们会用hugo命令来测试生成网站,这样就会产生public文件夹,这个文件夹不需要上传到仓库中。我们在Git工作目录中创建.gitignore文件,然后写入一下内容就可以忽略public文件夹。

1
public

小插曲

当时我主题是git clone的,导致了我的主题文件夹没有传到GitHub上,所以用Action编译的时候一直有问题,之后删除主题文件夹里的.git文件夹解决了此问题。


参考

  1. https://www.liaoxuefeng.com/wiki/896043488029600/900004590234208