Aller au contenu

Déployez votre site Astro sur Azion

Vous pouvez déployer votre projet Astro sur Azion, une plateforme permettant aux développeurs front-end de collaborer et de déployer des sites Web statiques (JAMstack) et SSR.

Pour commencer, vous aurez besoin de :

  • Un compte Azion. Si vous n’en avez pas, vous pouvez créer un compte gratuit.
  • Le code de votre application stocké dans un dépôt GitHub.
  • le CLI d’Azion installé pour une configuration et un déploiement de projet plus rapides.

Comment déployer via le tableau de bord de la console Azion

Titre de la section Comment déployer via le tableau de bord de la console Azion

Pour commencer à construire, suivez ces étapes :

  1. Accédez à la console d’Azion.
  2. Sur la page d’accueil, cliquez sur le bouton + Create.
    • Cela ouvre une fenêtre modale avec les options permettant de créer de nouvelles applications et ressources.
  3. Sélectionnez l’option Import from GitHub et cliquez sur la carte.
    • Cette action ouvre la page des paramètres.
  4. Connectez votre compte Azion à GitHub.
    • Une fenêtre contextuelle apparaîtra demandant une autorisation.
  5. Choisissez le dépôt que vous souhaitez importer depuis GitHub.
  6. Configurez les paramètres de construction :
    • Framework preset: Sélectionnez le framework approprié (par exemple, Astro).
    • Root Directory: Il s’agit du répertoire dans lequel se trouve votre code. Votre code doit se trouver dans le répertoire racine, et non dans un sous-répertoire. Un symbole ./ apparaît dans ce champ, indiquant qu’il s’agit d’un répertoire racine.
    • Install Command: la commande qui compile vos paramètres pour la création en production. Les commandes de création sont exécutées via des scripts. Par exemple : npm run build ou npm install pour un package NPM.
  7. Cliquez sur Save and Deploy.
  8. Surveillez le déploiement à l’aide d’Azion Real-Time Metrics et vérifiez que votre site est en ligne sur le périphérique.

Comment déployer un site statique à l’aide du CLI Azion

Titre de la section Comment déployer un site statique à l’aide du CLI Azion
  1. Installez le CLI d’Azion :

    • Téléchargez et installez le CLI d’Azion pour faciliter la gestion et le déploiement.
  2. Authentifiez l’interface CLI :

    • Exécutez la commande suivante pour authentifier votre CLI avec votre compte Azion.
    Fenêtre de terminal
    azion login
  3. Configurez votre application :

    • Utilisez les commandes suivantes pour initialiser et configurer votre projet :
    Fenêtre de terminal
    azion init
  4. Construisez votre projet Astro :

    • Exécutez votre commande de construction localement :
    Fenêtre de terminal
    azion build
  5. Déployez vos fichiers statiques :

    • Déployez vos fichiers statiques à l’aide du CLI d’Azion :
    Fenêtre de terminal
    azion deploy

Ce guide fournit une vue d’ensemble du déploiement d’applications statiques.

Activation du développement local à l’aide du CLI d’Azion

Titre de la section Activation du développement local à l’aide du CLI d’Azion

Pour que l’aperçu fonctionne, vous devez exécuter la commande suivante :

Fenêtre de terminal
azion dev

Une fois le serveur de développement local initialisé, l’application passe par le processus de build.

Fenêtre de terminal
Building your Edge Application. This process may take a few minutes
Running build step command:
...

Ensuite, lorsque la construction est terminée, l’accès à l’application est demandé :

Fenêtre de terminal
[Azion Bundler] [Server] › ✔ success Function running on port http://localhost:3000

Un projet utilisant un paquet NPM ne parvient pas à se construire avec un message d’erreur tel que [Error] Could not resolve "XXXX. The package "XXXX" wasn't found on the file system but is built into node.:

Cela signifie qu’un paquet ou une importation que vous utilisez n’est pas compatible avec les API d’exécution d’Azion.

Si vous importez directement une API d’exécution Node.js, veuillez vous référer à la compatibilité de Node.js avec Azion pour obtenir des étapes supplémentaires sur la façon de résoudre ce problème.

Si vous importez un paquet qui importe une API d’exécution Node.js, vérifiez auprès de l’auteur du paquet s’il prend en charge la syntaxe d’importation node:*. Si ce n’est pas le cas, vous devrez peut-être trouver un paquet alternatif.

Plus de guides de déploiement

Contribuer

Comment pouvons-nous vous aider ?

Créer une issue GitHub

Le moyen le plus rapide d'alerter notre équipe d'un problème.

Communauté