前言

本文待完善。

整体思路

使用Hugo作为博客框架，在本地编写Markdown文件，构成博客站点源码库。将源码库上传至GitHub仓库Hugoblog，并设置GitHub Action，由GitHub Action运行hugo命令生成博客HTML文件并上传至bitdove.github.io，最终由GitHub Pages完成部署。

所以需要两个GitHub仓库。

Hugoblog：用于存储站点源码。
bitdove.github.io：用于存储生成的HTML文件。

Hugo安装与配置

参考Hugo官方文档，根据操作系统选择安装方式。本文以macOS为例。

前提

Hugo依赖Git和Go，所以要先安装这两个。

不展开讲了。

安装hugo

本文采用Homebrew的安装方式

1

brew install hugo

安装结束，执行以下命令，看到版本号说明安装成功。

1

hugo version

新建站点

在你希望的位置执行下面的命令，新建一个Hugo站点。

1

hugo new site HugoBlog

这样会出现一个名为HugoBlog的文件夹，这就是博客源码。

选择主题

在官方主题库选择一个主题，当然也可以去GitHub找官方主题库里没有的主题。本文选择Stack主题。

本文选择Git Submodule的方式安装。

1
2
3


cd Hugoblog
git init
git submodule add https://github.com/CaiJimmy/hugo-theme-stack/ themes/hugo-theme-stack

这样theme文件夹下就会出现该主题。我想让我的博客跟Stack主题提供的Demo站点一样，所以做了一下事情。

把Hugoblog/themes/Hugo-theme-stack/exampleSite/content/下的内容复制到Hugoblog/content/。
删除Hugoblog/hugo.toml，把Hugoblog/themes/Hugo-theme-stack/Hugo.yaml复制到Hugoblog/。

这样执行以下命令，在本地预览，发现已经跟Demo一致。

1

hugo server -D

配置博客

各种个性化配置，包括该博客名称、换头像、改链接、去除自己不需要的多语言支持等等，在hugo.yaml中配置。

删除默认博文、删除默认分类和标签、修改博文默认模版等等。

不展开说了。

GitHub Actions

Push to GitHub

接下来就是把整个文件夹推到GitHub，在GitHub新建一个仓库Hugoblog。把本地的Hugoblog文件夹推到这个仓库。不细说了。

之后，因为我们以后写文章、更新博客，都是要推这个文件夹，所以写一个脚本更方便，在Hugoblog下新建一个名为deploy.sh的脚本文件，把以下内容复制粘贴过去。这样以后写完md文件，直接执行./deploy.sh就完成部署了。

 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


#!/bin/bash

# Check if the directory /public exists
if [ -d "./public" ]; then
  # If it exists, delete the directory
  rm -rf ./public
  echo "./public directory has been deleted."
else
  # If it doesn't exist, print a message
  echo "./public directory does not exist."
fi

# Check if a commit message was provided as an argument
if [ -z "$1" ]; then
    # If no commit message is provided, use the current date and time
    COMMIT_MSG="Update at $(date)"
else
    # Use the provided commit message
    COMMIT_MSG="$1"
fi

# Add all changes
git add .

# Commit changes with the provided message
git commit -m "$COMMIT_MSG"

# Push changes to the 'main' branch
git push origin main

# Print a success message
echo "Changes have been pushed to GitHub successfully!"

因为我们想这个库只保存源码，所以生成的静态HTML文件我们不要，所以在上传之前先检测有无/public文件夹，有的话删掉再上传。

Deploy Key

在本地用sshkeygen生成一对key

公钥给bitdove.github.io的Deploy key

私钥给Hugoblog的Actions的secrets。

Hugoblog的Workflow permissions改为Read and write permissions

GitHub Actions

给Hugoblog添加Actions

 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


name: Deploy Hugo to GitHub Pages

on:
  push:
    branches:
      - main  # Trigger deployment when changes are pushed to the main branch

jobs:
  deploy:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout the repository
        uses: actions/checkout@v2
        with:
          submodules: true

      - name: Set up Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: '0.134.2'
          extended: true
      
      - name: Build the website
        run: hugo

      - name: Deploy to GitHub Pages
        uses: peaceiris/actions-gh-pages@v3
        with:
          deploy_key: ${{ secrets.DEPLOY_KEY }}
          publish_dir: ./public  # This is the directory where Hugo generates static files
          external_repository: bitdove/bitdove.github.io
          publish_branch: main

GitHub图床

每个repo有1G的大小限制，如果把图片也传到博客仓库，很快就会满。

在GitHub新建一个图床库PicsBed_1

生成一个Token，选public_repo

安装PicGo，设置Token。

为PicsBed_1添加Actions如下

 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
35


name: Update README with Directory Structure

on:
  push:
    branches:
      - main

jobs:
  update-readme:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout repository
        uses: actions/checkout@v2

      - name: Generate directory structure
        run: |
          echo "# Directory Structure" > structure.txt
          echo "\`\`\`" >> structure.txt
          tree -I ".git|node_modules|structure.txt" >> structure.txt
          echo "\`\`\`" >> structure.txt          

      - name: Update README
        run: |
          cat structure.txt > README.md          

      - name: Commit changes
        run: |
          git config --local user.name "GitHub Action"
          git config --local user.email "action@github.com"
          git add README.md
          git commit -m "Update directory structure in README"
          git push          
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

References

Hugo官方文档

Stack主题官方网站

Stack主题官方GitHub仓库

图片上传工具PicGo官网

图片上传工具PicGo官方GitHub仓库