Używanie monorepozycji z App Hosting

Dzięki monorepo możesz porządkować wiele projektów i zarządzać nimi w jednym katalogu. Z tego przewodnika dowiesz się, jak zacząć wdrażać aplikacje oparte na Nx za pomocą App Hosting.

Wdrażanie monorepo za pomocą konsoli Firebase

Obsługa monorepo jest wbudowana w graficzny przepływ konfiguracji backendu w konsoli Firebase. Gdy w sekcji „Ustawienia wdrożenia” pojawi się prośba o podanie „Katalogu głównego”, określ ścieżkę do aplikacji, którą chcesz wdrożyć w repozytorium monorepo:

Zrzut ekranu widoku tworzenia backendu konsoli

Wdrażanie monorepo za pomocą wiersza poleceń Firebase

Obsługa monorepo jest wbudowana w proces konfiguracji backendu wywoływany przez polecenie interfejsu wiersza poleceń Firebase apphosting:backends:create. Po wejściu w ten proces i określeniu wybranego repozytorium GitHub pojawi się prośba o podanie katalogu głównego aplikacji względem repozytorium. W tym momencie podaj ścieżkę do aplikacji, którą chcesz wdrożyć w 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

Oto przykładowe komponenty, które zostaną wdrożone w przypadku poniższej struktury projektu Nx i aplikacji „target-app”, którą chcesz skompilować i wdrożyć:

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

Katalog główny aplikacji względem repozytorium to apps/target-app.

Rozwiązywanie problemów z wdrażaniem monorepo

  • Jeśli nie określisz pola „katalog główny”, kompilacja zakończy się niepowodzeniem i wyświetli komunikat, że App Hosting nie można znaleźć projektu do kierowania w repozytorium Nx.
  • W przypadku aplikacji Nx + Angular do ich tworzenia musisz użyć narzędzia do tworzenia aplikacji Angular. W pliku project.json określono narzędzie do tworzenia aplikacji Angular.