[教學] 使用 GitHub Action 做 CICD

史卯郁

3 min readApr 5, 2023

介紹

最近用 Angular 和 NestJS 做了專案，現在要來幫專案做自動部署。

流程

Github Actions 是 GitHub 的一個 CI/CD 工具。在 Github Actions 中配置workflow 工作流程，在推送到分支時自動進行部署和通知。

在專案的根目錄新增一個 .github/workflows 資料夾，再創建一個名為 ci.yml 的檔案。
在 yml 檔案如果需要設定較機密的資訊，如帳號、密碼，可以到 GitHub Repo 的 Settings → secrets and variables → Actions 中設定 secret。

3. yml 檔案撰寫定義一個 workflow。

name: workflow 的名稱。
on: workflow 觸發的條件。
job: workflow 中可以包含很多 jobs，例如 test 和 build-and-deploy就是 job 的名稱。

name: ci
on:
  push:
    branches:
      - main
      - 'feature/**'

jobs:
  build-and-deploy:
    if: github.ref == 'refs/heads/main'
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: 16
      - run: npm ci
      - run: npm run build -- --configuration=production --base-href=.
      - uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.TOKEN }}
          publish_dir: ./dist/read-bible

  test:
    if: startsWith(github.ref, 'refs/heads/feature/')
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: 16
      - run: npm ci
      - run: npm run test:ci