iT邦幫忙

2024 iThome 鐵人賽

DAY 22
0
自我挑戰組

讓我們一起與turboRepo共舞系列 第 22

turboRepo 單一儲存庫設置

  • 分享至 

  • xImage
  •  

雖然 Turborepo 在多套件工作區(通常稱為 monorepo)中非常強大,但它也可以用於加速單一套件工作區的開發流程。

Turborepo 的核心功能同樣適用於單一套件工作區,包括本地和遠端的快取以及任務並行化。只有一些針對多套件的功能(例如跨套件的任務,如 app#build)在單一套件環境中沒有意義。

安裝 Turborepo
將 Turborepo 安裝到您的應用程式中:

使用 PNPM
pnpm add turbo --save-dev

可選項目:全域安裝 turbo,以便直接從命令列執行。
npm install turbo --global

運行 Turborepo
安裝後,您可以執行 turbo build,Turborepo 將從您的 package.json 中運行 build 腳本。再次執行 turbo build,若程式碼沒有變更,將會命中快取,節省時間。

此時,Turborepo 已經提供了很大的價值,因為只有在程式碼變更時才會重新建置應用程式。只需簡單的兩個步驟,您就可以充分利用 Turborepo。

使用單一命令運行多個腳本
在許多專案中,都有需要執行的設定任務或預先建置步驟。這些任務通常一次運行一個,但您可以使用 Turborepo 同時執行它們。

例如,假設您有一個專案,每次開始工作時,都需要設定開發環境,包括:

啟動資料庫的 Docker 容器。
將資料庫架構推送到資料庫。
為資料庫填充種子數據。
啟動開發伺服器。
您可以使用 Turborepo 將這些任務排程到一個指令中。

  1. 在 package.json 中建立腳本
{
  "name": "@acme/my-app",
  "version": "0.0.0",
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "check-types": "tsc --noEmit",
    "db:up": "docker-compose up -d",
    "db:push": "your-orm-tool schema-push",
    "db:seed": "node ./db-seed.js"
  }
}
  1. 在 turbo.json 中配置任務順序
{
  "pipeline": {
    "dev": {
      "dependsOn": ["db:seed"],
      "cache": false,
      "persistent": true
    },
    "db:seed": {
      "dependsOn": ["db:push"],
      "cache": false
    },
    "db:push": {
      "dependsOn": ["db:up"],
      "cache": false
    },
    "db:up": {
      "cache": false
    }
  }
}

上述配置中,dependsOn 陣列為任務建立了執行順序。當您運行 turbo dev(無論是作為 package.json 腳本還是在終端中),任務將按照指定順序執行。

任務並行化
使用 Turborepo 的任務並行化功能,可以同時運行多個任務,加快整體執行速度。例如,您可以同時執行 ESLint、TypeScript 和 Prettier 的檢查。

  1. 在 package.json 中定義腳本
{
  "scripts": {
    "lint": "eslint .",
    "format": "prettier --check .",
    "check-types": "tsc --noEmit"
  }
}
  1. 在 turbo.json 中配置任務
{
  "pipeline": {
    "lint": {},
    "format": {},
    "check-types": {}
  }
}
  1. 同時運行所有任務
    turbo run lint format check-types
    使用輸入優化任務
    由於 Turborepo 將單一套件工作區視為一個包,因此它可以幫助優化任務的輸入,確保不相關的變更不會造成快取未命中。

例如,對於檢查類型的腳本 tsc --noEmit,可以設定僅包含 TypeScript 檔案的輸入:

{
  "pipeline": {
    "check-types": {
      "inputs": ["**/*.ts", "**/*.tsx"]
    }
  }
}

這樣,只有當 TypeScript 檔案變更時,才會重新執行 check-types 任務。

透過上述方式,您可以在單一套件工作區中充分利用 Turborepo 的強大功能,提升開發效率。


上一篇
深入探討 Turborepo 快取配置:提升 Monorepo 開發效率的秘訣
下一篇
在 Monorepo 中捆綁(Bundling)和發布套件的指南
系列文
讓我們一起與turboRepo共舞30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言