透過 App Hosting 使用單一存放區

使用單一存放區，您可以在單一目錄中整理及管理多個專案。本指南說明如何開始使用 App Hosting 部署以 Nx 為基礎的應用程式。

透過 Firebase 控制台部署 Monorepo

Firebase 控制台的圖形後端設定流程內建 Monorepo 支援功能。系統在「部署設定」下方提示輸入「根目錄」時，請指定要部署的應用程式在單一存放區中的路徑：

主控台後端建立檢視區塊的螢幕截圖

使用 Firebase CLI 部署 Monorepo

Firebase CLI 指令 apphosting:backends:create 叫用的後端設定流程內建 Monorepo 支援功能。進入這個流程並指定所選 GitHub 存放區後，系統會提示您指定應用程式的根目錄 (相對於存放區)；在提示中，傳遞要在 Monorepo 中部署的應用程式路徑：

$ firebase apphosting:backends:create --project [project-name]
i  === Import a GitHub repository
✔  Connected with GitHub successfully

? Which GitHub repo do you want to deploy? gh-username/nx-monorepo
? Specify your app's root directory relative to your repository path/to/app

舉例來說，假設 Nx 專案結構如下，且「target-app」是您要建構及部署的應用程式，則部署的資產如下：

.
    ├── lib
    ├── apps
    │   └── target-app
    │       ├── project.json
    │       └── src
    │           └── ...
    ├── nx.json
    ├── package-lock.json
    └── package.json

相對於存放區的應用程式根目錄為 apps/target-app。

排解單一存放區部署問題

  • 如果在後端設定期間將「根目錄」欄位留空，如果相關 nx.json 設定檔的 defaultProject 中指定了目標專案，App Hosting 仍可建構及部署該專案。
  • 如果您未指定「根目錄」欄位或 defaultProject，建構作業就會失敗，並顯示 App Hosting 無法在 Nx Monorepo 中找到目標專案的訊息。
  • 如果是 Nx + Angular 應用程式，您必須使用 Angular 應用程式建構工具建構應用程式。Angular 應用程式建構工具指定於 project.json