為Hexo設置GitHub Actions




為什麼我們需要幫Hexo配置GitHub Action?

設置好Github Action後我們就不在需要使用$ hexo generate命令來在本機產生靜態檔案,而是交由GitHub Action來做這件事。

你甚至不需要在本機安裝任何環境(包括nodejs),並且可以更專注的在寫文章這件事;通過設置,在有新的push進來後,GitHub Action會自動執行,接下來自動進行build hexo與部屬git page等動作。

來動手設置吧

_config.yml

首先確保你的url部分已經在_config.yml正確的設定了,詳細的做法可以參考官方文檔

而我的部落格是這樣設定的

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: https://p208p2002.github.io/blog/
root: /blog/
permalink: :year/:month/:day/:title/
permalink_defaults:
pretty_urls:
  trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
  trailing_html: true # Set to false to remove trailing '.html' from permalinks

設定ACCESS_TOKEN

接下來的操作需要一些Repo的存取權限,因此需要做ACCESS_TOKEN設定

前往 Setting > Developer settings > generate new token 然後將repo選項全勾選

前往你的 blog repo > settings > secrets
將剛剛的token貼入,並取名ACCESS_TOKEN

配置GitHub Actions

在你的專案資料夾新增資料夾與檔案,結構如下:

.github/
    - main.yml

然後編輯main.yml

name: Build and Deploy
on:
  push:
    branches:
      - master
jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Build 🔧
        uses: actions/checkout@v2 # If you're using actions/checkout@v2 you must set persist-credentials to false in most cases for the deployment to work correctly.
      - uses: actions/setup-node@v1
        with:
          node-version: '10.x'
      - run: |
          npm install -g hexo-cli
          npm install
          npm run build
      - name: Deploy 🚀
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.ACCESS_TOKEN }}
          publish_dir: ./public

Push

$ git push

到這邊就完成所有設定並且觸發GitHub Action了😉
你可以在你的Repo中的Action標籤看見目前Build與部屬的狀況
等到部屬完畢就可以在https://USERNAME.github.io/REPO/看到你的部落格

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料