Stellen Sie Ihre Frage und erhalten Sie einen Resümee des Dokuments, indem Sie diese Seite und den AI-Anbieter Ihrer Wahl referenzieren
Der Inhalt dieser Seite wurde mit einer KI übersetzt.
Den englischen Originaltext ansehenWenn Sie eine Idee haben, um diese Dokumentation zu verbessern, zögern Sie bitte nicht, durch das Einreichen eines Pull-Requests auf GitHub beizutragen.
GitHub-Link zur DokumentationMarkdown des Dokuments in die Zwischenablage kopieren
import { Steps } from '@astrojs/starlight/components'; import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
Firebase Hosting ist ein Dienst der App-Entwicklungsplattform Firebase von Google, der für die Veröffentlichung einer Astro-Website genutzt werden kann.
Siehe unseren separaten Leitfaden zum Hinzufügen von Firebase-Backend-Diensten wie Datenbanken, Authentifizierung und Speicher.
Projektkonfiguration
Dein Astro-Projekt kann in Firebase als statische Website oder als serverseitig gerenderte Website (SSR) bereitgestellt werden.
Statische Website
Dein Astro-Projekt ist standardmäßig eine statische Website. Du brauchst keine zusätzliche Konfiguration, um eine statische Astro-Site in Firebase bereitzustellen.
Adapter für SSR
Um SSR in deinem Astro-Projekt zu aktivieren und auf Firebase einzusetzen, füge den Node.js-Adapter hinzu.
:::note Für die Bereitstellung einer SSR-Astro-Site auf Firebase ist der Blaze-Plan oder höher erforderlich. :::
So funktioniert die Veröffentlichung
<PackageManagerTabs> <Fragment slot="npm"> ```shell npm install firebase-tools ``` </Fragment> <Fragment slot="pnpm"> ```shell pnpm add firebase-tools ``` </Fragment> <Fragment slot="yarn"> ```shell yarn add firebase-tools ``` </Fragment> </PackageManagerTabs>2. Authentifiziere das Firebase CLI mit deinem Google-Konto. Daraufhin öffnet sich ein Browserfenster, in dem du dich bei deinem Google-Konto anmelden kannst.
<PackageManagerTabs> <Fragment slot="npm"> ```shell npx firebase login ``` </Fragment> <Fragment slot="pnpm"> ```shell pnpm exec firebase login ``` </Fragment> <Fragment slot="yarn"> ```shell yarn firebase login ``` </Fragment> </PackageManagerTabs>3. Aktiviere die experimentelle Unterstützung von Web-Frameworks. Dies ist eine experimentelle Funktion, die es der Firebase CLI ermöglicht, deine Deployment-Einstellungen für Astro zu erkennen und zu konfigurieren.
<PackageManagerTabs> <Fragment slot="npm"> ```shell npx firebase experiments:enable webframeworks ``` </Fragment> <Fragment slot="pnpm"> ```shell pnpm exec firebase experiments:enable webframeworks ``` </Fragment> <Fragment slot="yarn"> ```shell yarn firebase experiments:enable webframeworks ``` </Fragment> </PackageManagerTabs>4. Initialisiere Firebase Hosting in deinem Projekt. Dadurch werden die Dateien firebase.json und .firebaserc im Stammverzeichnis deines Projekts erstellt.
<PackageManagerTabs> <Fragment slot="npm"> ```shell npx firebase init hosting ``` </Fragment> <Fragment slot="pnpm"> ```shell pnpm exec firebase init hosting ``` </Fragment> <Fragment slot="yarn"> ```shell yarn firebase init hosting ``` </Fragment> </PackageManagerTabs>5. Veröffentliche deine Website bei Firebase Hosting. Dadurch wird deine Astro-Website erstellt und auf Firebase bereitgestellt.
<PackageManagerTabs> <Fragment slot="npm"> ```shell npx firebase deploy --only hosting ``` </Fragment> <Fragment slot="pnpm"> ```shell pnpm exec firebase deploy --only hosting ``` </Fragment> <Fragment slot="yarn"> ```shell yarn firebase deploy --only hosting ``` </Fragment> </PackageManagerTabs>