攻略目標

過往我們使用Hexo架站大多數都會使用一鍵部署方式進行。

1
2
3
4
5
6
7
8
9
10
範例指令:

hexo clean
hexo g
hexo d

or

hexo clean
hexo d

一鍵部署(透過hexo-deployer-git)

  • 優點

    簡單的指令

    快速上線

  • 缺點

    網站源碼需要手動備份

    無法自動化細部操作


CICD部署

  • 優點

    快速上線

    備份及部署指令整合(更簡潔)

    源碼備份

    可客製化細部操作(如額外執行獨立程式等)

  • 缺點

    需要額外學習成本

攻略須知

必須要有部署過Hexo項目至Github的經驗,並且簡單瞭解Git指令,本篇攻略將較好上手!

  • 環境需具備以下:
    1. 擁有Hexo項目,並部署在個人的Github上。
    2. 已安裝Git


攻略步驟

Github Action 配置檔攻略

本篇將教導紅色區塊部分的配置,詳細請看下圖

配置檔流程圖

第一步

在Github創建好兩個項目,一個是私人的(假設自己的Blog源碼並不打算公開),一個是公開讓大家瀏覽的頁面(Github pages)。

新增項目後,頁面如下圖(尚未上傳東西)

第二步

在Private的項目中,點選上方的Actions。

第三步

點選 set up a workflow yourself,進行.yml檔的配置。

第四步

進行配置,以下提供個人的配置(信箱跟名字需要改成自己的)。

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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
# 配置檔名稱
name: Deploy
# 進行什麼行為時觸發,也可多行為觸發,例如[push, fork]
on: [push]

jobs:
pages:
# 環境提供作業系統,目前提供Windows, macOS, Ubuntu,詳細查閱(https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#choosing-github-hosted-runners)
runs-on: ubuntu-latest
steps:
# 拉取當前Repository的分支main的Code到他們的容器(如配置檔中使用的Runs-on的Ubuntu)上
- name: Checkout
uses: actions/checkout@v2
with:
ref: main

# 安裝Nodejs環境
- name: Use Node.js 17.7.1
uses: actions/setup-node@v2
with:
node-version: '17'

# 緩存
- name: Cache NPM Dependencies
uses: actions/cache@v2
with:
path: node_modules
key: ${{ runner.OS }}-npm-cache
restore-keys: |
${{ runner.OS }}-npm-cache

# 增加SSH KEY的配置
- name: Add SSH Private Key
env:
SSH_PRIVATE: ${{ secrets.HEXO_SSH_PRIVATE_KEY }}
run: |
mkdir -p ~/.ssh/
echo "$SSH_PRIVATE" > ~/.ssh/id_rsa
chmod 700 -R ~/.ssh
ssh-keyscan github.com >> ~/.ssh/known_hosts
git config --global user.email "你的Github信箱"
git config --global user.name "你的Github密碼"

# 安裝Hexo需要的環境(針對Hexo根目錄的package.json)
- name: Install Dependencies
run: |
npm install hexo-cli -g
npm install

# 一鍵化部署
- name: Hexo Deploy
run: |
hexo clean
hexo deploy

第五步

配置好後進行提交(Push)。

下圖就代表配置完成了!(配置完成後,會發現Actions有運行了,不過現階段尚會報錯,還需要把SSH給配好才行)。


SSH 配置攻略

本篇將教導紅色區塊部分的配置,詳細請看下圖

第一步

如果已經有再Github配置Global的ssh key,那麼這一步可以省略!

生成你的SSH KEY

1
ssh-keygen -t ed25519 -C "[email protected]"

生成你的SSH KEY,並且指定鑰匙的名字

1
ssh-keygen -t ed25519 -C "[email protected]" -f ~/.ssh/鑰匙名字

SSH的Key生成過程中會有一些詢問,一律按Enter下一步即可)

最終生成一把haha的公鑰及私鑰

第二步

進到你的私人項目中(放程式碼的地方),並且部署私鑰。

HEXO_SSH_PRIVATE_KEY這個名稱就是在yml配置的名稱,兩邊必須對應,否則會執行.yml程序時,會讀取不到鑰匙。

第三步

進到你的Github pages項目中,部署公鑰,配置方式同私鑰。

部署完畢後,就可以來進行測試了!

測試

在本地將程式碼Push到Github你的私人項目中,並且到Actions查看機器執行的狀態,若無意外,就大功告成啦!👋👋