Monorepos mit App Hosting verwenden

Mit Monorepos können Sie mehrere Projekte in einem einzigen Verzeichnis organisieren und verwalten. In diesem Leitfaden wird beschrieben, wie Sie mit der Bereitstellung von Turborepo- oder Nx-basierten Anwendungen mit App Hosting beginnen.

Monorepos mit der Firebase Console bereitstellen

Die Monorepo-Unterstützung ist in den grafischen Backend-Einrichtungsablauf in der Firebase Console integriert. Wenn Sie unter „Bereitstellungseinstellungen“ nach einem „Stammverzeichnis“ gefragt werden, geben Sie den Pfad zur Anwendung an, die Sie im Monorepo bereitstellen möchten:

Screenshot der Ansicht „Backend erstellen“ in der Console

Monorepos mit der Firebase-CLI bereitstellen

Die Unterstützung für Monorepos ist in den Backend-Einrichtungsablauf integriert, der über den Firebase-CLI-Befehl apphosting:backends:create aufgerufen wird. Nachdem Sie diesen Ablauf gestartet und das gewünschte GitHub-Repository angegeben haben, werden Sie aufgefordert, das Stammverzeichnis Ihrer Anwendung relativ zu Ihrem Repository anzugeben. Geben Sie bei dieser Aufforderung den Pfad zur Anwendung an, die Sie im Monorepo bereitstellen möchten:

$ 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

Hier sind beispielsweise die Assets, die bei der folgenden Projektstruktur und „target-app“ als Anwendung, die Sie erstellen und bereitstellen möchten, bereitgestellt werden:

Nx

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

Turborepo

.
    ├── packages
    ├── apps
    │   └── target-app
    │       ├── package.json
    │       └── src
    │           └── ...
    ├── turbo.json
    ├── package.json
    └── package-lock.json

Das Stammverzeichnis der App relativ zu Ihrem Repository ist apps/target-app.

Fehlerbehebung bei der Monorepo-Bereitstellung

  • Wenn Sie das Feld „Stammverzeichnis“ für Nx nicht angeben, schlägt der Build fehl und es wird eine Meldung angezeigt, dass App Hosting kein Projekt im Nx-Monorepo finden kann. Ebenso müssen Turborepo-Nutzer ein Ziel-App-Verzeichnis angeben, da es in Turborepo kein Konzept für ein Standardprojekt gibt.
  • Für Nx + Angular-Anwendungen müssen Sie das Build-System für Angular-Anwendungen verwenden, um die Anwendung zu erstellen. Der Angular-Anwendungs-Builder wird in project.json angegeben.