這次來實作Angular 在Github Action 的部屬範例

以下為Github Action的Angular workflow範例

name: Node.js CI

on:
    pull_request:
        branches: ['main']
    push:
        branches: ['main']
jobs:
    build:
        runs-on: ubuntu-latest 
            matrix:
                node-version: [16.x]
        steps:
            - uses: actions/checkout@v2
            // 描述
            - name: Use Node.js ${{ matrix.node-version }}
              uses: actions/setup-node@v2
              with:
                  node-version: ${{ matrix.node-version }}
                  cache: 'npm'
              // 這邊直接載相關套件
              // 通常是會用npm ci 才不會去更動到package.json
            - run: npm ci --force
              // 打包專案
            - run: npm run prerender
              // 上傳artifact
            - name: Upload build artifact
              if: github.ref == 'refs/heads/main'
              uses: actions/upload-artifact@v2
              // 設定檔案名稱、路徑、過期時間
              // 過期時間一定要設定，不然有空間限制在容易爆炸
              with:
                  name: prerender
                  path: dist
                  retention-days: 1
              // 這邊是設定當主要分支為main，才能夠部屬到github page
              // 如果是遠端伺服器可以透過最原始的scp把檔案複製過去
              // 但cd的流程通常要自動化跟伺服器本身要是能夠通的
            - run: npm run build:gitHubPage
              if: github.ref == 'refs/heads/main'
            - name: Deploy to GitHub Pages
              if: github.ref == 'refs/heads/main'
              uses: JamesIves/github-pages-deploy-action@4.1.5
              with:
                branch: gh-pages
                folder: dist/RonWeb/browser
                // 可以透過設置github action secrets來做安全設定
                token: ${{ secrets.TOKEN }}

1.  如何觸發這個work

on:
    pull_request:
        branches: ['main']
    push:
        branches: ['main']

2. 設定版本

build:
    	//運行os
        runs-on: ubuntu-latest 
        strategy:
        	// 運行版本，通常要指定，怕更新不相容問題
            matrix:
                node-version: [16.x]

3.  每個step的介紹使用

// 使用什麼工具，這邊的每個uses都對應著一個git hub的倉庫
// 如果想要知道裡面的流程，可以去翻對應的倉庫
// 像是這邊就是actions底下的checkout倉庫版本號為v2
- uses: actions/checkout@v2
// 描述
- name: Use Node.js ${{ matrix.node-version }}
	uses: actions/setup-node@v2
	// with是uses這個job他提供的額外引數
	// 提供什麼參數需看對應文件，或看原始碼所提供的參數
 	with:
		node-version: ${{ matrix.node-version }}
		cache: 'npm'

4. github action有個secrets的安全金鑰設定，通常會把token或是key的東西放在這邊設定使用

${{ secrets.TOKEN }}

對應倉庫

倉庫底下的action.yml 會有些相關使用參數的介紹