

Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.

# Stellen Sie eine Astro.js App für Amplify Hosting bereit
<a name="get-started-astro"></a>

Verwenden Sie die folgenden Anweisungen, um eine Astro.js -Anwendung für Amplify Hosting bereitzustellen. Sie können eine vorhandene Anwendung verwenden oder eine Starter-Anwendung anhand eines der offiziellen Beispiele von Astro erstellen. Informationen zum Erstellen einer Starter-Anwendung finden Sie in der *Astro-Dokumentation* unter [Verwenden eines Themes oder einer Starter-Vorlage](https://docs.astro.build/en/install-and-setup/#use-a-theme-or-starter-template).

Um eine Astro-Site mit SSR für Amplify Hosting bereitzustellen, müssen Sie Ihrer Anwendung einen Adapter hinzufügen. Wir unterhalten keinen Amplify-eigenen Adapter für das Astro-Framework. In diesem Tutorial wird der `astro-aws-amplify` Adapter verwendet, der von einem Mitglied der Community erstellt wurde. Dieser Adapter ist auf [Github verfügbar. com/alexnguyennz/astro-aws-amplify](https://github.com/alexnguyennz/astro-aws-amplify) auf der Website. GitHub AWS verwaltet diesen Adapter nicht.

**Um eine Astro-App für Amplify Hosting bereitzustellen**

1. Navigieren Sie auf Ihrem lokalen Computer zu der Astro-Anwendung, die Sie bereitstellen möchten.

1. Um den Adapter zu installieren, öffnen Sie ein Terminalfenster und führen Sie den folgenden Befehl aus. In diesem Beispiel wird der Community-Adapter verwendet, der auf [Github verfügbar ist. com/alexnguyennz/astro-aws-amplify](https://github.com/alexnguyennz/astro-aws-amplify). Sie können es durch den Namen des Adapters *astro-aws-amplify* ersetzen, den Sie verwenden.

   ```
   npm install astro-aws-amplify
   ```

1. Öffnen Sie die `astro.config.mjs` Datei im Projektordner für Ihre Astro-App. Aktualisieren Sie die Datei, um den Adapter hinzuzufügen. Die Datei sollte wie folgt aussehen.

   ```
   import { defineConfig } from 'astro/config';
   import mdx from '@astrojs/mdx';
   import awsAmplify from 'astro-aws-amplify';
    
   import sitemap from '@astrojs/sitemap';
    
   // https://astro.build/config
   export default defineConfig({
     site: 'https://example.com',
     integrations: [mdx(), sitemap()],
     adapter: awsAmplify(),
     output: 'server',
   });
   ```

1. Übernehmen Sie die Änderung und übertragen Sie das Projekt in Ihr Git-Repository.

   Jetzt sind Sie bereit, Ihre Astro-App auf Amplify bereitzustellen.

1. Melden Sie sich bei der an AWS-Managementkonsole und öffnen Sie die [Amplify-Konsole](https://console.aws.amazon.com/amplify/).

1. Wählen Sie auf der Seite „**Alle Apps**“ die Option **Neue App erstellen** aus.

1. Wählen Sie auf der Seite **Start building with Amplify** Ihren Git-Repository-Anbieter aus und klicken Sie dann auf **Weiter**.

1. Gehen Sie auf der Seite **Repository-Zweig hinzufügen** wie folgt vor:

   1. Wählen Sie den Namen des Repositorys aus, zu dem Sie eine Verbindung herstellen möchten.

   1. Wählen Sie den Namen des Repository-Zweigs aus, zu dem eine Verbindung hergestellt werden soll.

   1. Wählen Sie **Weiter** aus.

1. Suchen Sie auf der Seite mit den **App-Einstellungen** den Abschnitt **Build-Einstellungen**. Geben **Sie für Build-Ausgabeverzeichnis** Folgendes ein**.amplify-hosting**.

1. Sie müssen auch die Frontend-Build-Befehle der App in der Build-Spezifikation aktualisieren. Um die Build-Spezifikation zu öffnen, wählen Sie **YML-Datei bearbeiten**.

1. Suchen Sie in der `amplify.yml` Datei den Abschnitt mit den Frontend-Build-Befehlen. Geben Sie **mv node\$1modules ./.amplify-hosting/compute/default** ein.

   Ihre Build-Einstellungsdatei sollte wie folgt aussehen.

   ```
   version: 1
   frontend:
       phases:
           preBuild:
               commands:
                   - 'npm ci --cache .npm --prefer-offline'
           build:
               commands:
                   - 'npm run build'
                   - 'mv node_modules ./.amplify-hosting/compute/default'
       artifacts:
           baseDirectory: .amplify-hosting
           files:
               - '**/*'
       cache:
           paths:
               - '.npm/**/*'
   ```

1. Wählen Sie **Speichern**.

1. Wenn Sie möchten, dass Amplify App-Logs an Amazon CloudWatch Logs liefern kann, müssen Sie dies explizit in der Konsole aktivieren. Öffnen Sie den Abschnitt **Erweiterte Einstellungen** und wählen Sie dann im Abschnitt **Serverseitiges Rendering (SSR) -Bereitstellung die Option SSR-App-Logs** **aktivieren**.

1. Wählen Sie **Weiter** aus.

1. Wählen Sie auf der Seite **Überprüfen** die Option **Speichern** und bereitstellen aus.