須自行將 GitHub Pages 串起來

當使用 Hexo 快速建立 Blog 後,最後一哩路就是發佈到 GitHub。

Version


Node 10.15.3
Yarn 1.15.2
Hexo 3.8.0
Hexo-deployer-git 1.0.0

Hexo-deployer-git


1
$ yarn add hexo-developer-git

Hexo 預設並沒有包含發佈到 GitHub 的 package,需另外安裝。

使用 Yarn 安裝 hexo-developer-git

Configuration


_config.yml

1
# Deployment
## Docs: http://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: git@github.com:oomusou/oomusou.github.io.git

在 blog 根目錄的 _config.ymldeploy section,將 type 設定為 git,將 repo 設定到 GitHub 的 repository。

repo 的格式並非 https,其中 oomusou 部分為 GitHub account,稍後會介紹如何建立 repository

GitHub Pages


GitHub 提供了 GitHub Pages 服務,讓我們可以將 靜態網頁 發布到 GitHub,而不用像傳統必須到處找各種免費空間放 blog。

但 Github Pages 有以下兩個限制:

  1. 只能放 靜態網頁,也就是 HTML / JavaScript / CSS / images,不能放動態網頁,如 C# / Java / PHP / Ruby / Python …等,也不能放資料庫
  2. 一個帳號只能有一個提供專屬網址的 static site

也因為 GitHub Pages 有第一點限制,因此只能使用 Hexo 產生靜態網頁後,才能放到 GitHub,不能使用任何後端技術與資料庫。

但也因為不使用後端技術與資料庫,只是靜態網頁,再加上 GitHub 都會配合 CDN,因此 blog 的瀏覽速度非常快,不過也由於 Hexo 必須編譯產生靜態網頁,因此若 blog 文章太多時,Hexo 編譯的速度就是個挑戰,考驗 V8 與硬體速度。

deploy000

Github Pages 對每個 GitHub account 提供了專屬網址的 static site 服務,只要將 repository 取名為 [GitHub account].github.io,就能有專屬網址:[GitHub account].github.io

Deploy Keys


deploy001

要讓 hexo deploy 每次都能自動發佈到 GitHub,還必須設定 deploy keys。

settings 下選擇左側的 Deploy keys,按右側的 Add deploy key

但要貼什麼 key 呢 ?

deploy002

到 home directory 的 .ssh 目錄,cat id_rsa_github.pub,將顯示的文字貼到 GitHub 的 deploy key,將來 hexo deploy 時,就會以此 key 進行發佈。

Deploy to GitHub


1
$ hexo deploy

在 blog 目錄下輸入 hexo deploy,正式將之前使用 hexo generate 編譯到 public 目錄下的 HTML / JavaScript / CSS 發佈到 GitHub。

deploy003

Conclusion


  • 放到 GitHub 的 blog 也能設定自己的網域,不再侷限只是 [GitHub account].github.io 將有專文說明
  • 一個 deploy key 只能用在一個 GitHub account 的 repository,若你要有多個 blog,就必須註冊多個 GitHub account

Reference


Hexo, Deployment
GitHub, Github Pages

2019-04-13