Nota: Los ejecutores hospedados en GitHub no son compatibles con GitHub Enterprise Server actualmente. Puedes encontrar más información sobre el soporte que se tiene planeado en el futuro en el Itinerario público de GitHub.
Introducción
Esta guía te explica cómo utilizar las GitHub Actions para compilar y desplegar una app web a Azure Static Web Apps.
Prerrequisitos
Antes de crear tu flujo de trabajo de GitHub Actions, primero necesitarás completar los siguientes pasos de configuración:
-
Crea una Azure Static Web App utilizando la opción 'Other' como fuente de despliegue. Para obtener más información, consulta la sección "Guía de inicio rápido: Crear tu primer sitio en el portal de Azure" en la documentación de Azure.
-
Crea un secreto llamado
AZURE_STATIC_WEB_APPS_API_TOKEN
con el valor de tu token de despliegue de aplicación web estática. Para obtener más información sobre cómo encontrar tu token de despliegue, consulta la sección "Restablecer los tokens de despliegue en Azure Static Web Apps" en la documentación de Azure.
Crear un flujo de trabajo
Una vez que hayas completado los prerequisitos, puedes proceder con la creación del flujo de trabajo.
El siguiente flujo de trabajo de ejemplo demuestra cómo compilar y desplegar una aplicación web estática de Azure cuando exite una subida a la rama main
o cuando se abre, sincroniza o vuelve a abrir una solicitud de cambios que apunta a main
. El flujo de trabajo también derriba el despliegue de pre-producción correspondiente cuando se cierra una solicitud de cambios que apunta a main
.
Debajo del flujo de trabajo de la clave env
, cambia los siguientes valores:
APP_LOCATION
a la ubicación de tu código de clienteAPI_LOCATION
a la ubicación de tu código fuente de la API. SiAPI_LOCATION
no es relevante, puedes borrar la variable y las líneas en las que se utilizó.APP_ARTIFACT_LOCATION
a la ubicación de tu salida de compilación de código de cliente
Para obtener más información sobre estos valores, consulta la sección "Configuración de compilación para las Azure Static Web Apps" en la documentación de Azure.
# This workflow uses actions that are not certified by GitHub.
# Estas las proporcionan entidades terceras y las gobiernan
# condiciones de servicio, políticas de privacidad y documentación de soporte
# documentación.
name: Deploy web app to Azure Static Web Apps
env:
APP_LOCATION: "/" # location of your client code
API_LOCATION: "api" # location of your api source code - optional
APP_ARTIFACT_LOCATION: "build" # location of client code build output
on:
push:
branches:
- main
pull_request:
types: [opened, synchronize, reopened, closed]
branches:
- main
permissions:
issues: write
jobs:
build_and_deploy:
if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
runs-on: ubuntu-latest
name: Build and Deploy
steps:
- uses: actions/checkout@v2
with:
submodules: true
- name: Build And Deploy
uses: Azure/static-web-apps-deploy@1a947af9992250f3bc2e68ad0754c0b0c11566c9
with:
azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
repo_token: ${{ secrets.GITHUB_TOKEN }}
action: "upload"
app_location: ${{ env.APP_LOCATION }}
api_location: ${{ env.API_LOCATION }}
app_artifact_location: ${{ env.APP_ARTIFACT_LOCATION }}
close:
if: github.event_name == 'pull_request' && github.event.action == 'closed'
runs-on: ubuntu-latest
name: Close
steps:
- name: Close
uses: Azure/static-web-apps-deploy@1a947af9992250f3bc2e68ad0754c0b0c11566c9
with:
azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
action: "close"
Recursos adicionales
Los siguientes recursos también pueden ser útiles:
- Para encontrar el flujo de trabajo inicial original, consulta el archivo
azure-staticwebapp.yml
en el repositoriostarter-workflows
de GitHub Actions. - La acción que se utiliza para desplegar la app web es la acción
Azure/static-web-apps-deploy
oficial de Azure. - Para encontrar más ejemplos de flujos de trabajo de GitHub Actions que desplieguen a Azure, consulta el repositorio actions-workflow-samples.