在 GitHub Actions 中使用 Turborepo

以下範例說明如何在 GitHub Actions（在新分頁中開啟） 中使用 Turborepo。

對於給定的根 package.json

{
  "name": "my-turborepo",
  "scripts": {
    "build": "turbo run build",
    "test": "turbo run test"
  },
  "devDependencies": {
    "turbo": "1.2.5"
  }
}

和 turbo.json

{
  "$schema": "https://turbo.dev.org.tw/schema.json",
  "pipeline": {
    "build": {
      "outputs": [".next/**", "!.next/cache/**"],
      "dependsOn": ["^build"]
    },
    "test": {
      "dependsOn": ["^build"]
    }
  },
}

在儲存庫中建立名為 .github/workflows/ci.yml 的檔案，內容如下

name: CI
 
on:
  push:
    branches: ["main"]
  pull_request:
    types: [opened, synchronize]
 
jobs:
  build:
    name: Build and Test
    timeout-minutes: 15
    runs-on: ubuntu-latest
    # To use Remote Caching, uncomment the next lines and follow the steps below.
    # env:
    #  TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
    #  TURBO_TEAM: ${{ vars.TURBO_TEAM }}
    #  TURBO_REMOTE_ONLY: true
 
    steps:
      - name: Check out code
        uses: actions/checkout@v4
        with:
          fetch-depth: 2
 
      - name: Setup Node.js environment
        uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: 'npm'
 
      - name: Install dependencies
        run: npm install
 
      - name: Build
        run: npm run build
 
      - name: Test
        run: npm run test

遠端快取

若要將遠端快取與 GitHub Actions 搭配使用，請將以下環境變數新增到 GitHub Actions 工作流程，以讓 turbo 指令可以使用。

• TURBO_TOKEN - 存取遠端快取的 Bearer 令牌
• TURBO_TEAM - 單一儲存庫所屬的帳戶

若要使用 Vercel 遠端快取，你可以透過幾個步驟取得這些變數的值

1. 在 Vercel 控制台（在新分頁中開啟） 中為你的帳戶建立範圍存取令牌

將值複製到安全的地方。你稍後會需要它。

2. 前往 GitHub 儲存庫設定，並按一下機密，然後按一下動作索引標籤。建立一個名為 TURBO_TOKEN 的新機密，並輸入範圍存取權杖的值。

3. 建立一個名為 TURBO_TEAM 的新儲存庫變數（按一下變數索引標籤），並輸入團隊的 Vercel URL 值，不含 vercel.com/。使用儲存庫變數，而非機密，可讓 Github Actions 在記錄檔輸出中審查團隊名稱。

團隊 URL 可在儀表板的團隊一般專案設定中找到。如果您使用 Hobby 方案，則可以使用您的使用者名稱。您的使用者名稱可在 Vercel 個人帳戶設定（在新索引標籤中開啟） 中找到。

4. 在 GitHub Actions 工作流程的頂端，提供下列環境變數給使用 turbo 的工作。

# ...
 
jobs:
  build:
    name: Build and Test
    timeout-minutes: 15
    runs-on: ubuntu-latest
    # To use Turborepo Remote Caching, set the following environment variables for the job.
    env:
      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
      TURBO_TEAM: ${{ vars.TURBO_TEAM }}
 
    steps:
      - name: Check out code
        uses: actions/checkout@v4
        with:
          fetch-depth: 2
    # ...

使用 github actions/cache 進行快取

下列步驟說明如何使用 actions/cache（在新索引標籤中開啟） 在 github 上快取您的單一儲存庫成品。

1. 使用 --cache-dir 旗標為 turbo build 指令提供所需的快取輸出位置

• 範例 package.json，其中 .turbo 為所需的輸出目錄

{
  "name": "my-turborepo",
  "scripts": {
    "build": "turbo run build --cache-dir=.turbo",
  },
  "devDependencies": {
    "turbo": "1.2.5"
  }
}

2. 在 ci 檔案的建置步驟前，設定你的 github 管線，其中一個步驟使用 actions/cache@v3 動作。

• 確保 path 屬性設定在 actions/cache 動作中，與上面輸出的位置相符。

  • 在下面的範例中，path 設定為 .turbo。

• 在 key 屬性中，說明目前執行階段的快取金鑰。

  • 在下面的範例中，我們使用執行階段作業系統和 github sha 的組合作為快取金鑰。

• 在 restore-keys 屬性中，說明所需的快取前綴模式。確保此模式在未來的 ci 執行階段中仍然有效。

  • 在下面的範例中，我們使用 ${{ runner.os }}-turbo- 作為快取金鑰前綴模式進行搜尋。這樣一來，即使 github.sha 變更，我們仍然可以在任何後續的 ci 執行階段中命中快取。

• 範例 ci yaml，其中 .turbo 是所選的快取資料夾

    # ...
  jobs:
    build:
      runs-on: ubuntu-latest
      steps:
        - name: Check out code
          uses: actions/checkout@v4
   
        - name: Cache turbo build setup
          uses: actions/cache@v4
          with:
            path: .turbo
            key: ${{ runner.os }}-turbo-${{ github.sha }}
            restore-keys: |
              ${{ runner.os }}-turbo-
   
        - name: Setup Node.js environment
          uses: actions/setup-node@v4
          with:
            node-version: 20
            cache: 'npm'
   
        - name: Install dependencies
          run: npm install
   
        - name: Build
          run: npm run build
      # ...