Déployez votre site Astro sur les GitHub Pages

Vous pouvez utiliser les GitHub Pages pour héberger un site Astro directement depuis un dépôt sur GitHub.com.

Vous pouvez déployer un site Astro sur les GitHub Pages en utilisant une GitHub Actions afin d’automatiser le build et le déploiement de votre site. Pour faire ça, votre code source doit être hébergé sur GitHub.

Astro maintient l’action officielle withastro/action pour déployer vos projets avec très peu de configuration. Suivez les instructions ci-dessous pour déployer votre site Astro sur les GitHub Pages, et lisez le package README si vous souhaitez plus d’informations.

1. Définissez les options site, et si besoin, base dans astro.config.mjs.

       import { defineConfig } from 'astro/config'
   
       export default defineConfig({
         site: 'https://astronaut.github.io',
         base: '/my-repo',
       })

   • site devrait être quelque chose comme https://<YOUR_USERNAME>.github.io, ou https://mon-domaine-personnalise.com.
   • base doit être le nom de votre dépôt commençant par un slash, par exemple /my-repo. C’est ainsi qu’Astro comprend que la racine de votre site Web est /my-repo, plutôt que la valeur par défaut /.

2. Créez un nouveau fichier dans votre projet à .github/workflows/deploy.yml et collez-y le YAML ci-dessous.

   name: GitHub Pages Astro CI
   
   on:
     # Déclenchez le workflow chaque fois que vous poussez vers la branche `main`
     # Vous utilisez un nom de branche différent ? Remplacez `main` par le nom de votre branche
     push:
       branches: [ main ]
     # Vous permet d'exécuter ce workflow manuellement à partir de l'onglet Actions sur GitHub.
     workflow_dispatch:
   
   # Autoriser cette tâche à cloner le dépôt et à créer un déploiement de page
   permissions:
     contents: read
     pages: write
     id-token: write
   
   jobs:
     build:
       runs-on: ubuntu-latest
       steps:
         - name: Checkout your repository using git
           uses: actions/checkout@v2
         - name: Install, build, and upload your site
           uses: withastro/action@v0
           # with:
               # path: . # L'emplacement racine de votre projet Astro dans le dépôt. (facultatif)
               # node-version: 16 # La version spécifique de Node qui doit être utilisée pour build votre site. La valeur par défaut est 16. (facultatif)
               # package-manager: yarn # Le gestionnaire de paquets Node qui doit être utilisé pour installer les dépendances et build votre site. Détecté automatiquement en fonction de votre lockfile. (facultatif)
   
   
     deploy:
       needs: build
       runs-on: ubuntu-latest
       environment:
         name: github-pages
         url: ${{ steps.deployment.outputs.page_url }}
       steps:
         - name: Deploy to GitHub Pages
           id: deployment
           uses: actions/deploy-pages@v1

3. Sur GitHub, allez dans l’onglet Paramètres de votre dépôt et trouvez la section Pages des paramètres.

4. Choisissez GitHub Actions comme la Source de votre site, et Sauvegardez.

5. Faites un commit du nouveau fichier workflow et poussez-le sur GitHub.

Votre site devrait maintenant être publié ! Lorsque vous poussez des modifications dans le dépôt de votre projet Astro, le GitHub Action va automatiquement les déployer pour vous.