最全小白向!记hexo博客搭建及butterfly主题使用(二)


首先我们注意一下,在上一节中我们使用的是https协议进行部署,但在实际使用中发现,常常会出现SSL错误或者直接无法连上GitHub的问题。\

这时候我们可以配置文件中修改推送仓库为git协议,如

_config.yml
# Deployment
## Docs: <https://hexo.io/docs/one-command-deployment>
​ deploy:
​ type: git
​ repo: <git@github.com>:XXX/xxxxxx.github.io.git
​ branch: main

这样就不会出现部署失败的情况了。


之前我们讲了hexo的基本搭建和使用,但是搭建博客的目的是为了好好的写文章以及分享自己的知识和想法,所以每次写完文章后还要\

hexo clean
hexo generate
heox deploy
\

实在有些不太优雅,所以今天我们来讲一下它的自动部署。为了达成这个目的,我们借助了GitHub提供的GitHub action(也可以使用Travis CI,但不推荐),实现push即部署的目的。

使用 GitHub Actions 自动部署的好处

  • 可以直接在线编辑 md 文件,立即生效。假设你已发布一篇文章,过几天你在别的电脑上浏览发现有几个明显的错别字,这是完全不能容忍的。但此时你电脑上又没有 hexo + node.js + git 等完整的开发环境,重新配置开发环境明显不现实。如果使用 CI,你可以直接用浏览器访问 GitHub 上的项目仓库,直接编辑带错别字的 md 文章,改完,在线提交,稍等片刻,你的网站就自动更新了。
  • 如果手动部署,需要先执行 hexo g 编译生成静态文件, 然后推送 public 整个文件夹到 GitHub 上,当后期网站文章、图片较多时候,很多时候连接 GitHub 不是那么顺畅,经常要傻等很长的上传时间。使用 GitHub Actions 自动部署,你只需 push _post 文件里单独的 md 文件即可,其他不用管,效率瞬间高了许多,其中的好处,谁用谁知道。
  • 使用 GitHub Actions,你还可以一次性将这些静态博客页面部署到多个服务器上,例如:GitHub Pages、Gitee pages、七牛云、阿里云、腾讯云等等。

准备工作

源代码和博客静态页面可以选择分两个仓库或两个分支进行存储,但比较推荐的是分成两个仓库进行存储,这样的话就可以将源代码设为私有仓库,避免配置文件和大量堆积如山、杂乱的原稿被发现。
这里我们就以分两个仓库进行存储作为示例来讲解。

创建GitHub仓库

  • 私有仓库用来存储 Hexo 项目源代码。

  • 公共仓库用来存储编译之后的静态页面。

本例中均使用main分支进行演示。

创建 GitHub Token

创建一个有 repo 和 workflow 权限的 GitHub Token 。
进入"setting"-“Developer settings”-"Personal access tokens"里,点击Generate new token

确认密码后,自己写个名字,选择有效时间(不建议选择永久,最好定期更换),如图勾选repo和workflow即可(注意生成的token只会生成一次,丢失后重新生成即可

添加 repository secret

将上面生成的 Token 添加到私有仓库的 “Settings”-“Secrets” 里,自己定一个名字(注意这个名字在后面的配置文件中会用到)。
步骤:私有仓库 -> settings -> Secrets -> New repository secret。

添加 Actions 配置文件

在这里我们使用了使用了 theme-keep 组织封装的现有函数 hexo-deploy-github-pages-action(支持者可以去大佬仓库star和fork),如果希望自己更改配置,也可以尝试自己写配置文件。(推荐此文讲的比较清楚)

  1. 在你的 Hexo 项目根目录下创建 .github 文件夹。
  2. 在 .github 文件夹下创建 workflows 文件夹。
  3. 在 workflows 文件夹下创建 hexo-deploy.yml 文件。

hexo-deploy.yml 文件的内容如下:

hexo-deploy.yml
name: deploying Hexo project to GitHub pages
on:
push:
branches:
- main # main 分支有 push 行为时就触发这个 action

jobs:
build-and-deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@master

- name: Build and Deploy
uses: theme-keep/hexo-deploy-github-pages-action@master # 使用专门部署 Hexo 到 GitHub pages 的 action
env:
PERSONAL_TOKEN: ${{ secrets.HEXO_DEPLOY }} # secret 名
PUBLISH_REPOSITORY: zero617/zero617.github.io # 公共仓库,格式:GitHub 用户名/仓库名
BRANCH: main # 静态页面仓库分支
PUBLISH_DIR: ./public # 部署 public 目录下的文件


到这里准备工作就结束了,可以进入部署了。

部署自动触发流程

  1. 修改你的 Hexo 博客源代码(例如:增加文章、修改文章、更改主题、修改主题配置文件等等)。
  2. 把你修改过的 Hexo 项目内容(只提交修改过的那部分内容) push 到 GitHub 私有仓库(本例:keep-site-source)的 master 分支。
  3. GitHub Actions 检测到 master 分支有内容 push 进来,会自动执行 action 配置文件的命令,将 Hexo 项目编译成静态页面,然后部署到公共仓库的 gh-pages 分支。
  4. 在私有仓库的 Actions 可以查看到你配置的 action。


(如果报错可以点击进入查询报错原因)

想了解hexo基本使用,可以看之前的文章 [[最全小白向!记hexo博客搭建及 butterfly主题使用(一)]]

本文大量摘自此文:
作者:XPoet
链接:https://juejin.cn/post/6943895271751286821
来源:稀土掘金