Hexo + Github Actions部署在线博客

2025年4月18日 • 1144 字 • 3 分钟

hexo

前言

需求为使用 github pages搭建一个在线的静态网站，方便记录日志和文档，经过选型，决定采用 hexo方案。

hexo采用 node.js编译，能自动将 md文件编译为静态网页，因此最终采用的方案为：

使用 hexo框架将 md编译成静态网址，然后部署到 github pages中，为了减少手动部署的繁琐，决定使用 github action功能自动部署

github需要新建两个仓库：

online-blog-source （用于存放源码）
brettzhang.github.io （github page，由于显示静态网页）

准备工作

github 准备

本方案中，需要将 source中的代码经过 github action自动编译部署到 github pages中，因此需要先授权：

本地电脑上运行以下命令生成密钥：

 ssh-keygen -f github-deploy-key

当前目录下会有 github-deploy-key 和 github-deploy-key.pub 两个文件。

`source`仓库配置

进入对应仓库 Settings -> Secrets and variables -> Actions -> New repository secret中添加

name填写 HEXO_DEPLOY_PRI
Secret中添加本地文件 github-deploy-key中的值（通过文本工具打开复制即可）

`github page`仓库配置

进入对应仓库 Settings -> Deploy keys -> Add deploy key中添加

Title配置为 HEXO_DEPLOY_PUB
Key配置为本地文件 github-deploy-key.pub中的内容（通过文本工具打开分支即可）
勾选 Allow write access 一定要勾选，否则 github action部署时，会提示无权限

本地电脑环境安装

本人采用 pnpm管理 node.js项目，因此需要先安装 pnpm，并配置全局仓库，在 ~/.zshrc中添加内容

# pnpm
export PNPM_HOME="/home/work/tool/pnpm"
case ":$PATH:" in
  *":$PNPM_HOME:"*) ;;
  *) export PATH="$PNPM_HOME:$PATH" ;;
esac
# pnpm end

Hexo 初始化

本地新建一个与 source同名仓库文件夹（不同名也可以），然后终端进入对应目录中

cd online-blog-source

安装 hexo工具：

pnpm add hexo-cli -g

然后初始化博客框架：

hexo init .

安装主题hexo-theme-icarus,并将 hexo配置为对应主题：

pnpm add hexo-theme-icarus hexo-renderer-inferno babel-plugin-inferno @babel/preset-env 

# 也可手动修改_config.yml
hexo config theme icarus

安装 hexo git插件，用于编译完成之后，自动推送到 github page仓库，如果不装此插件，部署时会提示找不到 git

hexo-deployer-git

然后可以本地开启预览：

hexo server

此时如果终端没有提示报错的话，那么可以通过 http://localhost:4000/预览。

上传与部署

上传源码

将本地文件夹初始化为 git仓库，并上传到 source 仓库

# 注意分支 我这里默认创建的是main分支
git init .

# 添加远端仓库
git remote add origin git@github.com:brettzhang/online-blog-source.git

# 提交
git add .
git commit -m 'init'
git push -u origin main

配置 `github action`

添加本地仓库新建 .github/workflows/deploy.yml文件,并添加以下内容：

name: Deploy hexo blog

on:
  workflow_dispatch:
    inputs:
      name:
        description: 'Person to greet'
        required: true
        default: 'World'
  push:
    branches:
      - main # default branch

jobs:
  build:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [20.x]

    steps:
      - uses: actions/checkout@v4
        with:
          token: ${{ secrets.GITHUB_TOKEN }}
          # If your repository depends on submodule, please see: https://github.com/actions/checkout
          submodules: recursive

      # install pnpm to instead of npm
      - uses: pnpm/action-setup@v4
        name: Install pnpm
        with:
          version: 10
          run_install: false

      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          # Examples: 20, 18.19, >=16.20.2, lts/Iron, lts/Hydrogen, *, latest, current, node
          # Ref: https://github.com/actions/setup-node#supported-version-syntax
          node-version: ${{ matrix.node-version }}
          cache: 'pnpm'

      - name: Configuration environment
        env:
          HEXO_DEPLOY_PRI: ${{secrets.HEXO_DEPLOY_PRI}}
        run: |
          sudo timedatectl set-timezone "Asia/Shanghai"
          mkdir -p ~/.ssh/
          echo "$HEXO_DEPLOY_PRI" | tr -d '\r' > ~/.ssh/id_ed25519
          chmod 600 ~/.ssh/id_ed25519
          eval `ssh-agent`
          ssh-add ~/.ssh/id_ed25519
          ssh-keyscan github.com >> ~/.ssh/known_hosts

          git config --global user.name "brettzhang"
          git config --global user.email "brttzhang@outlook.com"

      - name: Install Dependencies
        run: |
          pnpm add hexo-cli -g
          pnpm install

      - name: Deploy hexo
        run: |
          hexo clean
          hexo d -g

然后上传到服务器：

git add .
git commit -m 'add action yaml'
git push origin main

前言