Utilizzare i monorepo con App Hosting

Con i monorepo puoi organizzare e gestire più progetti in un'unica directory. Questa guida descrive come iniziare a eseguire il deployment di app basate su Nx con App Hosting.

Esegui il deployment di monoreposi con l'interfaccia a riga di comando di Firebase

Il supporto dei monorepo è integrato nel flusso di configurazione del backend invocato dal comando apphosting:backends:create dell'interfaccia a riga di comando Firebase. Dopo aver inserito questo flusso e specificato il repository GitHub scelto, ti viene chiesto di specificare la directory principale dell'app rispetto al repository. A questo prompt, passa il percorso dell'applicazione che vuoi eseguire il deployment all'interno del 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

Ad esempio, di seguito sono riportati gli asset che verranno di cui verrà eseguito il deployment in base alla seguente struttura del progetto Nx e a "target-app" come applicazione che vuoi compilare e di cui eseguire il deployment:

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

La directory principale dell'app relativa al tuo repository è apps/target-app.

Esegui il deployment di monorepo con la Console Firebase

Il supporto del monorepo è integrato nel flusso di configurazione del backend grafico nella console Firebase. Quando ti viene chiesto di specificare una "Directory principale" in "Impostazioni di deployment", specifica il percorso dell'applicazione che vuoi eseguire nel monorepo:

Screenshot della visualizzazione di creazione del backend della console

Risoluzione dei problemi di deployment del monorepo

  • Se lasci vuoto il campo "directory principale" durante la configurazione del backend, App Hosting potrebbe comunque essere in grado di compilare e implementare il progetto di destinazione dell'utente se è specificato in defaultProject del file di configurazione .
  • Se non specifichi il campo "directory principale" né un defaultProject, la compilazione non andrà a buon fine e verrà visualizzato un messaggio che indica che defaultProject non riesce a trovare un progetto di destinazione all'interno del monorepo Nx.App Hosting
  • Per le applicazioni Nx + Angular, devi utilizzare il compilatore di applicazioni Angular per compilare l'applicazione. Lo strumento di creazione di applicazioni Angular è specificato in project.json