Hexo博客自动部署:使用GitHub Actions实现持续集成与部署
Hexo博客自动部署:使用GitHub Actions实现持续集成与部署
Hexo是一款流行的静态博客框架,使用GitHub Actions可以实现博客的自动化部署,让开发者能够更专注于内容创作,而无需频繁手动部署。本文将详细介绍如何使用GitHub Actions实现Hexo博客的自动部署。
为了简化Hexo部署过程,你可以使用持续集成工具(如GitHub Actions)来实现自动化部署。GitHub Actions是一个持续集成和持续交付(CI/CD)平台,允许你自动化你的构建、测试和部署管道。你可以创建工作流来构建和测试存储库的每个拉取请求,或将合并的拉取请求部署到生产环境。GitHub Actions支持多种编程语言和技术栈,并且可以与GitHub的其他功能(如问题、拉取请求和讨论)无缝集成。
主要特点
- 自动化工作流:你可以创建自定义工作流来处理从代码提交到部署的整个软件开发周期。
- 事件触发:工作流可以由多种事件触发,如推送代码到仓库、创建拉取请求、发布新版本等。
- 并行执行:你可以并行运行多个作业,加快处理速度。
- 集成支持:支持与多种第三方服务集成,如AWS、Azure、Google Cloud等。
- 自定义容器:可以使用自定义容器来运行你的工作流。
基本概念
- Workflow:一个可配置的自动化过程,包含一个或多个作业。
- Job:一个工作流中的一个任务,包含多个步骤。
- Step:一个作业中的一个单独的任务,可以是一个shell脚本或一个action。
- Action:一个可重用的扩展,可以执行复杂但经常重复的任务。
1、创建博客源代码仓库
因为我们需要Hexo源代码才能生成静态文件,所以我们需要建立一个私有仓库来保存我们的源代码,当然如果你觉得麻烦也可以建立一个分支来保存,不过通常我们会将纯静态文件和源码文件分别存放到两个仓库里,一个可以作为公开仓库对外展示,源码目录需要设为私有,有利于更好地保护你的文章版权。
例如用来发布到Pages服务的公开仓库通常命名为your-name.github.io
存放源码的目录则没有命名上的要求,例如blog_source
2、生成 Github Token
点击头像 => Settings => Developer settings =>
用户验证
设置根据需要设置过期时间,我这里设置永不过期,权限勾选repo
以及workflow
生成后记得保存起来,只显示一次
3、修改 config.yml
大部分人之前应该都是在本地进行博客编写,所以连接GitHub的方式一般都是使用的ssh,我们为了方便后续自动部署,需要把config.yml
文件中的deploy => repository => github
值改成token url
的形式。
deploy:
- type: git
repo: shiguang://shiguang-coding.github.io.git
branch: main
改为
deploy:
- type: git
repo: https://{$GH_TOKEN}@github.com/shiguang-coding/shiguang-coding.github.io.git,main
将{$GH_TOKEN}
替换成刚才生成的token,仓库地址是博客静态文件最终存放的仓库地址,即开通GitHub Pages服务的那个仓库地址。
这里可以同时部署到多个仓库,只需复制一份配置信息即可
deploy:
- type: git
repo: https://{$GH_TOKEN}@github.com/your-name/your-name.github.io.git,main
- type: git
repo: https://{$GH_TOKEN}@github.com/your-name/your-repo.git,main
4、创建 GitHub Actions 脚本
GitHub Actions的工作流文件存放在源代码仓库的.github/workflows
目录。workflow文件采用YAML格式,文件名可以任意取,但是后缀名统一为.yml
,比如deploy.yml
。一个库可以有多个workflow文件。GitHub在我们完成预设触发条件时,只要发现.github/workflows
目录里面有.yml
文件,就会自动读取运行该文件。
可以手动建立此文件,或者通过
源代码仓库 => Actions => 选择 Setup Node
创建,但最终同样都需push到远端源代码仓库中。
name: Shiguang's Blog CI/CD # 脚本 workflow 名称
on:
push:
branches: [main, master] # 当监测 main,master 的 push
paths: # 监测所有 source 目录下的文件变动,所有 yml,json 后缀文件的变动。
- '*.json'
- '**.yml'
- '**/source/**'
jobs:
blog: # 任务名称
timeout-minutes: 30 # 设置 30 分钟超时
runs-on: ubuntu-latest # 指定最新 ubuntu 系统
steps:
- uses: actions/checkout@v2 # 拉取仓库代码
- uses: actions/setup-node@v2 # 设置 node.js 环境
with:
node-version: '18' # 根据你的 Node.js 版本进行调整
- name: Cache node_modules # 缓存 node_modules,提高编译速度,毕竟每月只有 2000 分钟。
uses: actions/cache@v2
env:
cache-name: cache-node-modules
with:
path: ~/.npm
key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
restore-keys: |
${{ runner.os }}-build-${{ env.cache-name }}-
${{ runner.os }}-build-
${{ runner.os }}-
- name: Init Node.js # 安装源代码所需插件
run: |
npm install
echo "init node successful"
- name: Install Hexo-cli # 安装 Hexo
run: |
npm install -g hexo-cli --save
echo "install hexo successful"
- name: Build Blog # 编译创建静态博客文件
run: |
hexo clean
hexo g
echo "build blog successful"
- name: Deploy Shiguang's Blog # 设置 git 信息并推送静态博客文件
run: |
git config --global user.name "your name"
git config --global user.email "your email"
hexo deploy
- run: echo "Deploy Successful!"
代码提交前需要检查下是否已安装一键部署插件hexo-deployer-git
npm install hexo-deployer-git --save
若提示Deployer not found: git
则说明尚未引入该插件依赖
代码提交后会自动执行Actions,可查看部署记录及日志
例如我部署时由于没有添加主题依赖导致构建错误,可以查看相关日志,想了解更多可参考文章Hexo执行报错 unknown block tag: xxxx
部署失败也会有邮件提醒
Action执行成功后,在你存放静态文件的博客仓库也可以看到相应更新
参考
【Hexo自动部署】优雅的使用 Github Actions 进行 Hexo 静态博客的持续集成与部署