使用 Github Actions 自动部署 Hexo 博客

博主： Smj.Love.C
发布时间：2023 年 06 月 01 日
1698 次浏览
暂无评论
9495字数
分类： Hexo

## 前置说明

当博客文章的越来越多时，使用 `hexo g` 生成需要的时间也越来越长。电脑性能差的话要更长时间、我们等的也要更久。此时我们就需要一个能够只推送 hexo 源文件、能够自动将 Hexo 源文件编译成静态文件来达到自动部署。听不懂？直接看教程吧！

## 介绍

[GitHub Actions](https://github.com/features/actions) 是 GitHub 的持续集成服务，于 2018 年 10 月 [推出](https://github.blog/changelog/2018-10-16-github-actions-limited-beta/)。

[![](https://smjc.cc/usr/uploads/2023/06/532694703.png)](https://smjc.cc/usr/uploads/2023/06/532694703.png)

## 使用

### 创建仓库

我们需要一个`私有仓库`用来存放 Hexo 的源文件、用来执行 Action

[![](https://smjc.cc/usr/uploads/2023/06/295010959.png)](https://smjc.cc/usr/uploads/2023/06/295010959.png)

### 生成 Token

为确保 `hexo d` 有足够的访问权限、我们需要创建 `token`

因为我需要同时部署到 Github 、Coding 和 Gitee 上、就需要生成三个 token (`你可以选择你需要的来创建`)

* Github
* Coding
* Gitee

进入 [Github](https://github.com/) 、点击`头像 -> Settings`

[![](https://smjc.cc/usr/uploads/2023/06/351641868.png)](https://smjc.cc/usr/uploads/2023/06/351641868.png)

找到 `Developer settings`

[![](https://smjc.cc/usr/uploads/2023/06/3749646077.png)](https://smjc.cc/usr/uploads/2023/06/3749646077.png)

点击 `Personal access tokens`

[![](https://smjc.cc/usr/uploads/2023/06/944790607.png)](https://smjc.cc/usr/uploads/2023/06/944790607.png)

点击 `Generate new token`

[![](https://smjc.cc/usr/uploads/2023/06/125081707.png)](https://smjc.cc/usr/uploads/2023/06/125081707.png)

名字随便取、一定要勾选 `repo`

[![](https://smjc.cc/usr/uploads/2023/06/4055503658.png)](https://smjc.cc/usr/uploads/2023/06/4055503658.png)

`请复制生成token`、因为只会生成一次、如果忘记了、记得重新生成

[![](https://smjc.cc/usr/uploads/2023/06/3034775254.png)](https://smjc.cc/usr/uploads/2023/06/3034775254.png)

### 编辑 _config.yml

> 我这里使用的是 [hexo-deployer-git](https://github.com/hexojs/hexo-deployer-git) 插件，你也可以参考 [CCKNBC 大佬的配置](https://github.com/ccknbc-actions/blog-butterfly/blob/master/.github/workflows/Deploy%20Hexo%20Public%20To%20Pages.yml)

编辑根目录下的 `_config.yml` 找到 编辑

针对 `Github`、`Coding` 和 `Gitee`、填入相应的 `token`

```
deploy:
- type: git
  repo:
    gitHub: https://你的Github用户名:生成的Token@github.com/你的Github用户名/仓库名.git
    gitee: https://你的Gitee用户名:生成的Token@gitee.com/你的Gitee用户名/仓库名
    coding: https://令牌用户名:生成的Token@e.coding.net/你的Coding用户名/仓库名.git
  branch: master
  message: 'Deloyed by Github Actions: {{ now("YYYY-MM--DD HH:mm:ss") }}'
```

例如我的：

[![](https://smjc.cc/usr/uploads/2023/06/1181891849.png)](https://smjc.cc/usr/uploads/2023/06/1181891849.png)

### 配置 Github Action

在博客根目录新建 `.github` 文件夹、然后在里面再新建一个 `workflows` 文件夹

[![](https://smjc.cc/usr/uploads/2023/06/1400927315.png)](https://smjc.cc/usr/uploads/2023/06/1400927315.png)

在里面新建一个 `yml` 格式的文件，`名字随便起`

里面写 Github Actions 的配置内容：

当然下面的部分内容需要根据自己配置如：

* `branches` 分支：如果你的仓库分支是 `master` 就写 `master`,`main` 就写 `main`
* `你的用户名`：换成你的 github 用户名 例如我的：`zykjofficial`
* `你的邮箱`：换成你 github 绑定的邮箱 `xxx@xxx.com`
* `博客静态文件仓库地址`：换成你 github 仓库、github.io 结尾的仓库。例如我的：`https://github.com/zykjofficial/zykjofficial.github.io.git`

```
name: 自动部署

on: 
  push:
    branches:
      # 根据你的仓库分支来写
      - master

release:
    types:
      - published

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
    - name: 检查分支
      uses: actions/checkout@v2
      with:
        ref: master

- name: 安装 Node
      uses: actions/setup-node@v1
      with:
        node-version: "12.x"

- name: 缓存依赖
      uses: actions/cache@v2.1.1
      id: cache-dependencies
      with:
        path: node_modules
        key: ${{runner.OS}}-${{hashFiles('**/package-lock.json')}}

- name: 安装 Hexo
      run: |
        npm install hexo-cli -g

- name: 安装依赖
      if: steps.cache.outputs.cache-hit != 'true'
      run: |
        export TZ='Asia/Shanghai'
        npm install --save

- name: 生成静态文件
      run: |
        hexo clean
        hexo generate
    
    - name: 部署
      run: |
        git config --global user.name "你的用户名"
        git config --global user.email "你的邮箱"
        git clone 博客静态文件仓库地址 .deploy_git # clone 静态文件仓库，防止 Hexo 推送时覆盖整个静态文件仓库，只推送有更改的文件
        hexo deploy
```

这下面是我的配置、仅供参考 (`如果和我的配置不一样请不要复制`):

* 番剧获取 [https://github.com/HCLonely/hexo-bilibili-bangumi](https://github.com/HCLonely/hexo-bilibili-bangumi)
* Gulp 博客压缩 ~[https://demo.jerryc.me/posts/4073eda/#Gulp%E5%A3%93%E7%B8%AE](https://demo.jerryc.me/posts/4073eda/#Gulp%E5%A3%93%E7%B8%AE)~ 链接失效
* Gitee 自动部署 [https://github.com/yanglbme/gitee-pages-action](https://github.com/yanglbme/gitee-pages-action) (目前 Gitee 需要实名认证才能使用 Gitee Pages, 所以我不使用了)
  
  ```
  name: 自动部署
  
  on: 
    push:
      branches:
        - master
  
    release:
      types:
        - published
  
  jobs:
    deploy:
      runs-on: ubuntu-latest
      steps:
      - name: 检查分支
        uses: actions/checkout@v2
        with:
          ref: master
  
      - name: 安装 Node
        uses: actions/setup-node@v1
        with:
          node-version: "12.x"
  
      - name: 安装 Hexo 和 Gulp
        run: |
          npm install hexo-cli -g
          npm install gulp-cli -g    
  
      - name: 缓存依赖
        uses: actions/cache@v2.1.1
        id: cache-dependencies
        with:
          path: node_modules
          key: ${{runner.OS}}-${{hashFiles('**/package-lock.json')}}    
  
      - name: 安装依赖
        if: steps.cache.outputs.cache-hit != 'true'
        run: |
          export TZ='Asia/Shanghai'
          npm install --save
  
      - name: 生成静态文件并压缩
        run: |
          hexo clean
          hexo bangumi -u
          hexo generate
          gulp
  
      - name: 部署
        run: |
          git config --global user.name "zykjofficial"
          git config --global user.email "xx@xxx"
          git clone https://github.com/zykjofficial/zykjofficial.github.io.git .deploy_git
          hexo deploy
  
      # - name: 同步到 Gitee
      #   uses: wearerequired/git-mirror-action@master
      #   env:
      #       # 注意在 Settings->Secrets 配置 GITEE_RSA_PRIVATE_KEY
      #       SSH_PRIVATE_KEY: ${{ secrets.GITEE_RSA_PRIVATE_KEY }}
      #   with:
      #       # 注意替换为你的 GitHub 源仓库地址
      #       source-repo: "git@github.com:zykjofficial/zykjofficial.github.io.git"
      #       # 注意替换为你的 Gitee 目标仓库地址
      #       destination-repo: "git@gitee.com:zykjofficial/zykjofficial.git"
  
      # - name: 构建 Gitee Pages
      #   uses: yanglbme/gitee-pages-action@master
      #   with:
      #       # 注意替换为你的 Gitee 用户名
      #       gitee-username: zykjofficial
      #       # 注意在 Settings->Secrets 配置 GITEE_PASSWORD
      #       gitee-password: ${{ secrets.GITEE_PASSWORD }}
      #       # 注意替换为你的 Gitee 仓库
      #       gitee-repo: zykjofficial/zykjofficial
  
      - name: 刷新缓存
        run: |
          curl https://purge.jsdelivr.net/gh/zykjofficial/zykjofficial.github.io@master/css/*.*
          curl https://purge.jsdelivr.net/gh/zykjofficial/zykjofficial.github.io@master/js/*.*
          curl https://purge.jsdelivr.net/gh/zykjofficial/zykjofficial.github.io@master/img/*.*
  ```

### 推送仓库

如果主题目录下有 `.git 文件夹（隐藏文件夹）` 、部署可能会失败、需要采取以下三种方法之一：

1. 方法 1：(不推荐) 直接将 `themes\butterfly\.git` 文件夹删除，博主就是这样做的、或者将 `.git 文件夹` 移动到其他地方、自动部署完成之后再移动回来
2. 方法 2：重新设置远程仓库地址和分支
   BASH
   
   |
   
   ```
   1
   2
   3
   4
   5
   6
   ```
   
   |
   
   ```
   git remote rm origin
   git remote add origin [url] #url为新的存放源码的github仓库
   git checkout -b master # master 这里记得修改成你仓库的分支
   git add .
   git commit -m "github action update"
   git push origin master # master 这里记得修改成你仓库的分支
   ```
   
   |
| ----------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
   
   
3. 方法 3：submodule 高级操作 [Flex 大佬的方法](https://blog.flesx.cn/posts/17931.html#%E5%BC%80%E5%A7%8B)
   BASH
   
   |
   
   ```
   1
   ```
   
   |
   
   ```
   git submodule add 主题GitHub仓库地址 themes/主题文件夹名
   ```
   
   用 `submodule` 会直接从主题 GitHub 仓库获取主题文件，所以如果有魔改就不会生效（也可以 Fork 主题仓库再魔改，然后 submodule add 你 Fork 的地址）

---

然后在博客根目录下创建`.gitignore` 文件、用来忽略上传文件

如 `node_modules` `.deploy_git` `public/` 这些大文件可以不用上传

```
.DS_Store
Thumbs.db
db.json
*.log
node_modules/
public/
.deploy_git/
.idea
```

最后在博客根目录下执行 (都是 git 命令啦、不会去学习一下 [Git 的安装与使用](https://zykj.js.org/posts/6536dfdf))

* 第一次使用

`你的仓库地址.git`: 你创建的私有仓库地址。

`master`: 如果是 `main` 分支记得修改一下。

```
git init
git add .
git commit -m "first commit"
git remote add origin 你的仓库地址.git
git push -u origin master # master 这里记得修改成你仓库的分支
```

* 之后使用

```
git add .
git commit -m "commit内容"
git push
```

提交完成之后、进入你的私有仓库、点击 `Action`

[![](https://smjc.cc/usr/uploads/2023/06/3701816550.png)](https://smjc.cc/usr/uploads/2023/06/3701816550.png)

进入之后点击提交信息再次进入查看

[![](https://smjc.cc/usr/uploads/2023/06/2539374703.png)](https://smjc.cc/usr/uploads/2023/06/2539374703.png)

点击 `deploy` 就可以查看状态了

[![](https://smjc.cc/usr/uploads/2023/06/1499572322.png)](https://smjc.cc/usr/uploads/2023/06/1499572322.png)

都打上了绿勾就说明部署成功了

[![](https://smjc.cc/usr/uploads/2023/06/3489330799.png)](https://smjc.cc/usr/uploads/2023/06/3489330799.png)

## 结语

到这里、你已经成功完成了自动部署、是不是很简单呢！虽然我也部署了 4 次才成功的、都是因为 coding 仓库的地址填写错误、呜呜呜

```

转自
[https://zykj.js.org/posts/ea8e8e59/](https://zykj.js.org/posts/ea8e8e59/)

最后修改：2023 年 06 月 01 日

如果觉得我的文章对你有用，请随意赞赏

发表评论取消回复
使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款

评论 *

私密评论

名称 *

🎲

邮箱 *

地址

使用 Github Actions 自动部署 Hexo 博客

发表评论取消回复
使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款

搭建内网穿透NPS、FRP与宝塔面板共存共用80端口的方法

使用 PingInfoView，优选适合自己的 CF 优选域名

数控车加工网纹

宝宝今天打疫苗

[FRP教程]Winds10设置FRP内网穿透后台自动运行

宝宝出生第十六天

win10的系统用mastercam9.1特别卡

宝宝出生第十一天

青龙面板详细安装教程

宝宝出生第十九天

使用 Github Actions 自动部署 Hexo 博客

发表评论 取消回复 使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款

使用 Github Actions 自动部署 Hexo 博客

发表评论取消回复
使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款