Home Github Action 自動部署 github-pages
Post
Cancel

Github Action 自動部署 github-pages

Github pages 適合展示靜態頁面,只要在 github 建立 gh-pages 分支,可依據用戶名稱和repo名稱來開啟頁面。

1
https://[USER_NAME].github.io/[REPO_NAME]/

以這個專案為例

https://github.com/chenuin/JavaScript30

路徑會是

https://chenuin.github.io/JavaScript30/

使用 JamesIves/github-pages-deploy-action@v4.3.3 有兩個必填參數:

  • branch: 分支
  • folder: 目錄,.代表整個repo根目錄

參數詳細說明請參考這裡,在 repo 裡新增 github action (連結):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
name: Github pages

on:
  # Triggers the workflow on push events but only for the "master" branch
  push:
    branches: master

  # Allows you to run this workflow manually from the Actions tab
  workflow_dispatch:

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout 🛎️
        uses: actions/checkout@v3

      - name: Deploy 🚀
        uses: JamesIves/github-pages-deploy-action@v4.3.3
        with:
          branch: gh-pages
          folder: .
          token: $

GH_PAT 設定方式,請先至 Settings => Developer settings => Personal access tokens (或下方連結),按右上角新增Token,scopes 可直接勾選 repo 並將Token複製。

https://github.com/settings/tokens

再到專案的 Settings => Secrets => Actions (或下方連結),按右上角新增,命名 GH_PAT 並將剛剛複製的Token貼上。

https://github.com/[USER_NAME]/[REPO_NAME]/settings/secrets/actions

Github secrets

相關文章
This post is licensed under CC BY 4.0 by the author.