Physical Address
304 North Cardinal St.
Dorchester Center, MA 02124
Physical Address
304 North Cardinal St.
Dorchester Center, MA 02124
在解決問題之道上不斷前行
記錄一下使用 Github Action 部署 Github Pages 的流程
我這邊需求是 node + vue
步驟很簡單:
記得一兩年前 Github 就棄用輸入密碼的方式允許外部方式連線 repo,都必須要用 token。設定方式如下
先在大頭像找到 setting
接著在左側欄找到 Developer Settings
選擇 Token(classic)
選擇 Generate new token (classic)
scopes 至少要勾以下範圍
這邊就不解釋 Action 的做法
請參考 文件
我用的是這組 action :JamesIves/[email protected]
相關參數寫在這邊:https://github.com/JamesIves/github-pages-deploy-action
name: Deploy
on:
push:
branches:
- main
jobs:
build-and-deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v2
- name: Install & Build
run: |
npm install
npm run build
- name: Deploy
uses: JamesIves/[email protected]
with:
branch: gh-pages
folder: dist
${{ secrets.ACCESS_TOKEN }} 就是從 ACCESS_TOKEN 的設定取值,不要將 token 暴露在明碼上
name: Deploy
on:
push:
branches:
- main
jobs:
build-and-deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v2
- name: Install & Build
run: |
npm install
npm run build
- name: Deploy Antoher Repo
uses: JamesIves/[email protected]
with:
branch: gh-pages
folder: dist
token: ${{ secrets.ACCESS_TOKEN }}
repository-name: Sakasky/SEZ
要另外在專案中設定 token
以 yml 為例子
Name就設定 ACCESS_TOKEN
然後將 token 放到 Secret 裡面
測試過要先設定或不設定都可以,若不先設定,而直接部署的話也可以
只要每次 commit / push 完,Action 就會自動幫部署網頁啦,超級方便!