Aller au contenu

Migration depuis Gridsome

Gridsome est un générateur de sites statiques open-source basé sur Vue et GraphQL.

Principales similitudes entre Gridsome et Astro

Titre de la section Principales similitudes entre Gridsome et Astro

Gridsome et Astro partagent certaines similitudes qui vous aideront à migrer votre projet :

Principales différences entre Gridsome et Astro

Titre de la section Principales différences entre Gridsome et Astro

Lorsque vous reconstruisez votre site Gridsome dans Astro, vous remarquerez quelques différences importantes :

  • Gridsome est une application monopage (SPA) basée sur Vue. Les sites Astro sont des applications multi-pages construites à l’aide de composants .astro, mais peuvent également supporter React, Preact, Vue.js, Svelte, SolidJS, AlpineJS, Lit et le templating HTML brut.

  • En tant que SPA, Gridsome utilise vue-router pour le routage SPA, et vue-meta pour gérer <head>. Dans Astro, vous créerez des pages HTML séparées et contrôlerez le <head> de votre page directement, ou dans un composant de mise en page.

  • Données de fichiers locaux : Gridsome utilise GraphQL pour récupérer les données de vos fichiers de projet. Astro utilise les importations ESM et l’aide Astro.glob() pour importer des données à partir de fichiers de projets locaux. Les ressources distantes peuvent être chargées en utilisant l’API standard fetch(). GraphQL peut être optionnellement ajouté à votre projet, mais n’est pas inclus par défaut.

Pour convertir un blog Gridsome en Astro, commencez par notre modèle de démarrage de thème de blog, ou explorez d’autres thèmes de blog communautaires dans notre vitrine de thèmes.

Vous pouvez passer un argument --template à la commande create astro pour démarrer un nouveau projet Astro avec l’un de nos modèles de démarrage officiels. Vous pouvez aussi démarrer un nouveau projet à partir de n’importe quel dépôt Astro existant sur GitHub.

Fenêtre de terminal
npm create astro@latest -- --template blog

Apportez vos fichiers Markdown existants (ou MDX, avec notre intégration optionnelle) comme contenu pour [créer des pages Markdown ou MDX] (/fr/guides/markdown-content/).

La structure de projet de Gridsome étant similaire à celle d’Astro, vous pourrez peut-être copier plusieurs fichiers existants de votre projet au même endroit dans votre nouveau projet Astro. Cependant, les deux structures de projet ne sont pas identiques. Vous pouvez examiner la structure de projet d’Astro pour voir quelles sont les différences.

Comme Astro interroge et importe vos fichiers locaux différemment de Gridsome, vous pouvez lire comment charger des fichiers en utilisant Astro.glob() pour comprendre comment travailler avec vos fichiers locaux.

Pour convertir d’autres types de sites, tels qu’un site de portfolio ou de documentation, consultez d’autres modèles de démarrage officiels sur astro.new. Vous trouverez un lien vers le dépôt GitHub de chaque projet, ainsi que des liens en un clic pour ouvrir un projet fonctionnel dans les environnements de développement en ligne StackBlitz, CodeSandbox et Gitpod.

Plus de guides sur les migrations

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é