Freigeben über


Erstellen von Zweigvorschauumgebungen in Azure Static Web Apps

Sie können Ihre Website so konfigurieren, dass jede Änderung an Zweigstellen bereitgestellt wird, die keine Produktionszweige sind. Diese Vorschaubereitstellung wird unter einer stabilen URL veröffentlicht, die den Branchnamen enthält. Wenn der Branch beispielsweise dev heißt, ist die Umgebung an einem Ort wie <DEFAULT_HOST_NAME>-dev.<LOCATION>.azurestaticapps.net verfügbar. Eine Branch-Umgebung kann im Portal über die Registerkarte Umgebungen Ihrer statischen Web-App gelöscht werden.

Konfiguration

Um stabile URL-Umgebungen zu aktivieren, nehmen Sie die folgenden Änderungen an Ihrer configuration.yml Datei vor.

  • Legen Sie die production_branch Eingabe auf den Namen Ihres Produktionszweiges für den static-web-apps-deploy Auftrag in der GitHub-Aktion oder der AzureStaticWebApp-Aufgabe fest. ** Diese Aktion stellt sicher, dass Änderungen an Ihrem Produktions-Branch in die Produktionsumgebung deployt werden, während Änderungen an anderen Branches in eine Vorschauumgebung deployt werden.
  • Listen Sie die Branches auf, die Sie zum Bereitstellen in Vorschauumgebungen im Triggerarray Ihrer Workflow-Konfiguration verwenden möchten, sodass Änderungen an diesen Branches auch die Ausführung der Bereitstellung durch GitHub Actions oder Azure Pipelines auslösen.
    • Legen Sie dieses Array auf ** für GitHub Actions oder * für Azure Pipelines fest, wenn Sie alle Branches verfolgen möchten.

Beispiel

Im folgenden Beispiel wird veranschaulicht, wie Branch Preview-Umgebungen aktiviert werden.

name: Azure Static Web Apps CI/CD

on:
  push:
    branches:
      - main
      - dev
      - staging
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches:
      - main

jobs:
  build_and_deploy_job:
    ...
    name: Build and Deploy Job
    steps:
      - uses: actions/checkout@v2
        with:
          submodules: true
      - name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          ...
          production_branch: "main"

Hinweis

Der ... Code wird aus Gründen der Übersichtlichkeit übersprungen.

In diesem Beispiel werden die Vorschauumgebungen für die dev und staging Branches definiert. Jeder Branch wird in einer separaten Vorschauumgebung bereitgestellt.

Nächste Schritte