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 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.

npx astro add vercel

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

Installiere den @astrojs/vercel Adapter 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
```

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

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

Pushe deinen Code in dein Online-Git-Repository (GitHub, GitLab, BitBucket).
Importiere dein Projekt in Vercel.
Vercel wird Astro automatisch erkennen und die richtigen Einstellungen vornehmen.
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

Installiere das Vercel CLI und führe vercel aus, um es zu veröffentlichen.
Terminal-Fenster
```
npm install -g vercel
vercel
```
Vercel wird Astro automatisch erkennen und die richtigen Einstellungen vornehmen.
Wenn du gefragt wirst: Want to override the settings? [y/N], wähle N.
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.