monorepo を使用すると、1 つのディレクトリに複数のプロジェクトを整理して管理できます。このガイドでは、App Hosting を使用して Nx ベースのアプリのデプロイを開始する方法について説明します。
Firebase CLI を使用してモノレポジトリをデプロイする
Monorepo のサポートは、Firebase CLI コマンド apphosting:backends:create
によって呼び出されるバックエンド設定フローに組み込まれています。このフローに入り、選択した GitHub リポジトリを指定すると、リポジトリを基準とするアプリのルート ディレクトリを指定するように求められます。このプロンプトで、monorepo 内にデプロイするアプリケーションのパスを渡します。
$ firebase apphosting:backends:create --project [project-name] --location us-central1
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
です。
Firebase コンソールでモノレポジトリをデプロイする
Monorepo のサポートは、Firebase コンソールのグラフィカルなバックエンド設定フローに組み込まれています。[デプロイ設定] で [ルート ディレクトリ] のプロンプトが表示されたら、monorepo 内にデプロイするアプリケーションのパスを指定します。
monorepo デプロイのトラブルシューティング
- バックエンドのセットアップ時に [root directory] フィールドを空白のままにした場合、関連する nx.json 構成ファイルの
defaultProject
に指定されている場合、App Hosting はユーザーのターゲット プロジェクトをビルドしてデプロイできる場合があります。 - [root directory] フィールドも
defaultProject
も指定しない場合、ビルドは失敗し、App Hosting が Nx モノレポ内のターゲット プロジェクトを見つけられないというメッセージが表示されます。 - Nx + Angular アプリケーションの場合は、Angular アプリケーション ビルダーを使用してアプリケーションをビルドする必要があります。Angular アプリケーション ビルダーは
project.json
で指定します。