Zum Inhalt springen
Astro Astro

Veröffentliche deine Astro-Site in Vercel

Du kannst Vercel verwenden, um einen Astro-Standort ohne Konfiguration in dessen globales Edge-Netzwerk einzubinden.

Diese Anleitung enthält Anweisungen für die Veröffentlichung in Vercel über die Website-UI oder die CLI von Vercel.

Projektkonfiguration

Dein Astro-Projekt kann in Vercel als statische Website oder als serverseitig gerenderte Website (SSR) veröffenlicht werden.

Statische Website

Dein Astro-Projekt ist standardmäßig eine statische Website. Du brauchst keine zusätzliche Konfiguration, um eine statische Astro-Site in Vercel einzusetzen.

Adapter für SSR

Um SSR in deinem Astro-Projekt zu aktivieren und auf Vercel zu veröffentlichen:

Füge den Vercel-Adapter (EN) hinzu, um SSR in deinem Astro-Projekt mit dem folgenden Befehl “astro add” zu aktivieren. Damit installierst du den Adapter und nimmst in einem Schritt die entsprechenden Änderungen an deiner Datei “astro.config.mjs” vor.

Terminal-Fenster
npx astro add vercel

Wenn du den Adapter stattdessen lieber manuell installieren möchtest, führe die folgenden zwei Schritte aus:

  1. Installiere den @astrojs/vercel Adapter (EN) mit deinem bevorzugten Paketmanager in die Abhängigkeiten deines Projekts. Wenn du npm verwendest oder dir nicht sicher bist, führe dies im Terminal aus:

    Terminal-Fenster
      npm install @astrojs/vercel

  2. Füge zwei neue Zeilen zu deiner Projektkonfigurationsdatei astro.config.mjs hinzu.

    astro.config.mjs
    import { defineConfig } from 'astro/config';
    import vercel from '@astrojs/vercel/serverless';
    

    export default defineConfig({
      output: 'server',
      adapter: vercel(),
    });

Wie man veröffenlicht

Du kannst Vercel über die Benutzeroberfläche der Website oder über die Befehlszeilenschnittstelle (CLI) von Vercel veröffentlichen. Das Verfahren ist für statische und SSR-Astro-Sites gleich.

Website-UI-Veröffentlichung

  1. Pushe deinen Code in dein Online-Git-Repository (GitHub, GitLab, BitBucket).
  2. Importiere dein Projekt in Vercel.
  3. Vercel wird Astro automatisch erkennen und die richtigen Einstellungen vornehmen.
  4. Deine Anwendung wird bereitgestellt! (z.B. astro.vercel.app)

Nachdem dein Projekt importiert und veröffenlicht wurde, erzeugen alle nachfolgenden Pushes zu Branches Preview Deployments, und alle Änderungen am Produktionszweig (allgemein “main”) führen zu einem Production Deployment.

📚 Erfahre mehr über die Git Integration von Vercel.

CLI-Veröffentlichung

  1. Installiere das Vercel CLI und führe vercel aus, um es zu veröffentlichen.

    Terminal-Fenster
    npm install -g vercel
    vercel

  2. Vercel wird Astro automatisch erkennen und die richtigen Einstellungen vornehmen.

  3. Wenn du gefragt wirst: Willst du die Einstellungen überschreiben? [y/N], wähle N.

  4. Deine Anwendung wird veröffenlicht! (z.B. astro.vercel.app)

Projektkonfiguration mit vercel.json

Du kannst vercel.json verwenden, um das Standardverhalten von Vercel außer Kraft zu setzen und zusätzliche Einstellungen zu konfigurieren. Du kannst zum Beispiel Header an die HTTP-Antworten deiner Veröffentlichungen anhängen.

📚 Erfahre mehr über Vercel’s Projektkonfiguration.

Auf Astro 2.0 aktualisieren

Astro v2.0 stellt die Unterstützung für Node 14 ein. Stelle also sicher, dass dein Projekt Node 16.12.0 oder höher verwendet. Du kannst die Node.js-Version, die während des Build-Schritts und der Serverless-Funktionen verwendet wird, auf der Seite Allgemein unter Projekteinstellungen festlegen.

Veröffentlichungs-Anleitungen

Weitere Veröffentlichungs-Anleitungen

Nach Art filtern