Utiliser monorepos avec App Hosting

Avec les monorepos, vous pouvez organiser et gérer plusieurs projets dans un seul répertoire. Ce guide explique comment commencer à déployer des applications basées sur Turborepo ou Nx avec App Hosting.

Déployer des monorepos avec la console Firebase

La prise en charge des monorepos est intégrée au flux de configuration graphique du backend dans la Firebase console. Lorsque vous êtes invité à indiquer un "Répertoire racine" sous "Paramètres de déploiement", spécifiez le chemin d'accès à l'application que vous souhaitez déployer dans le monorepo :

Capture d'écran de la vue de création du backend de la console

Déployer des monorepos avec Firebase CLI

La prise en charge des monorepos est intégrée au flux de configuration du backend appelé par la Firebase commande CLI apphosting:backends:create. Une fois que vous avez accédé à ce flux et spécifié le dépôt GitHub de votre choix, vous êtes invité à spécifier le répertoire racine de votre application par rapport à votre dépôt. À cette invite, transmettez le chemin d'accès à l'application que vous souhaitez déployer dans le 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

Par exemple, voici les éléments qui seraient déployés étant donné la structure de projet suivante et "target-app" comme application que vous souhaitez compiler et déployer :

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

Le répertoire racine de l'application par rapport à votre dépôt est apps/target-app.

Résoudre les problèmes de déploiement de monorepo

  • Si vous ne spécifiez pas le champ "Répertoire racine" pour Nx, la compilation échouera et affichera un message indiquant que App Hosting ne trouve pas de projet cible dans le monorepo Nx. De même, les utilisateurs de Turborepo doivent spécifier un répertoire d'application cible, car il n'existe pas de concept de projet par défaut dans Turborepo.
  • Pour les applications Nx + Angular, vous devez utiliser le compilateur d'applications Angular pour compiler l'application. Le compilateur d'applications Angular est spécifié dans project.json.