Aller au contenu

Migration depuis SvelteKit

SvelteKit est un cadre de travail pour la création d’applications web à partir de Svelte.

Principales similitudes entre SvelteKit et Astro

Titre de la section Principales similitudes entre SvelteKit et Astro

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

Principales différences entre SvelteKit et Astro

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

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

  • Les sites Astro sont des applications multi-pages, alors que SvelteKit utilise par défaut des SPA (applications mono-page) avec un rendu côté serveur, mais peut également créer des MPA, des SPA traditionnelles, ou vous pouvez mélanger ces techniques au sein d’une application.

  • Composants : SvelteKit utilise Svelte. Les pages Astro sont construites en utilisant les composants .astro, mais peuvent aussi supporter React, Preact, Vue.js, Svelte, SolidJS, AlpineJS, Lit et le templating HTML brut.

  • Axé sur le contenu : Astro a été conçu pour mettre en valeur votre contenu et vous permettre d’opter pour l’interactivité uniquement en cas de besoin. Une application SvelteKit existante peut être conçue pour une forte interactivité côté client. Astro a des capacités intégrées pour travailler avec votre contenu, comme la génération de pages, mais peut nécessiter des techniques Astro avancées pour inclure des éléments qui sont plus difficiles à reproduire en utilisant les composants .astro, comme les tableaux de bord.

  • Prêt pour du Markdown : Astro intègre le support Markdown, et inclut une propriété YAML layout spéciale frontmatter utilisée par fichier pour le templating des pages. Si vous convertissez un blog SvelteKit basé sur le Markdown, vous n’aurez pas à installer une intégration Markdown séparée et vous n’aurez pas à définir une mise en page via un fichier de configuration. Vous pouvez utiliser vos fichiers Markdown existants, mais vous devrez peut-être les réorganiser, car le routage basé sur les fichiers d’Astro ne nécessite pas de dossier pour chaque page.

Pour convertir un blog SvelteKit 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épart 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.

Bien que les composants de routage et de mise en page basés sur les fichiers soient similaires dans Astro, vous pouvez consulter la structure de projet d’Astro pour savoir où les fichiers doivent être placés.

Pour convertir d’autres types de sites, tels qu’un portfolio ou un site de documentation, consultez les modèles de départ 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