Déployer un site SvelteKit statique : la voie de l'adaptateur statique

· jsdeck team · 4 min de lecture
Déployer un site SvelteKit statique : la voie de l'adaptateur statique

Si vous avez recherché deploy a SvelteKit static site, vous voulez le chemin le plus court et le plus fiable entre un code qui fonctionne et une URL publique — sans monter de serveurs, sans apprendre un tableau de bord cloud tentaculaire, et sans saisir une carte bancaire avant d'avoir le moindre utilisateur. Ce guide explique exactement comment y parvenir avec jsdeck, quels sont les compromis, et quand un autre outil est réellement le meilleur choix. Nous resterons concrets : étapes réelles, commandes réelles et limites honnêtes.

Prérequis

  • Node.js installé (ou le SDK pertinent pour votre framework)
  • Un projet qui se build en fichiers statiques (souvent dist/, build/ ou out/)
  • Un compte jsdeck gratuit — sans carte bancaire requise

Si votre projet tourne déjà localement et produit un dossier de build, vous avez tout ce qu'il faut.

Construire un bundle statique

L'idée clé derrière le déploiement d'un site SvelteKit statique est que votre framework compile en HTML, CSS et JavaScript simples. Lancez votre build de production (npm run build pour la plupart des setups) et confirmez qu'un dossier de sortie apparaît. Ouvrez-le localement avec npx serve dist (ajustez le nom du dossier) pour vérifier que tout fonctionne avant d'uploader quoi que ce soit.

Déployer en quatre étapes

  1. Build : npm run build
  2. Inscription : créer un compte gratuit
  3. Upload : glissez le dossier de sortie dans le tableau de bord jsdeck, ou lancez jsdeck deploy
  4. Vérification : ouvrez votre URL *.jsdeck.com et testez la navigation, les liens profonds et l'actualisation

Routage côté client sur hébergeurs statiques

Si votre app utilise un routeur côté client, les chemins inconnus doivent être réécrits vers index.html, sinon une actualisation sur un lien profond renvoie un 404. jsdeck applique le fallback SPA automatiquement pour les apps hébergées, donc React Router, Vue Router et similaires fonctionnent out of the box. (Pour les mécanismes sous-jacents, voir nos guides de correction de routage dans le hub.)

Domaine personnalisé, HTTPS et persistance

HTTPS est provisionné automatiquement pour les sous-domaines jsdeck. Quand vous êtes prêt pour la production, ajoutez un domaine personnalisé depuis le tableau de bord de l'app. Si votre app doit stocker quoi que ce soit, activez le datastore plutôt que de vous fier au stockage navigateur seul, pour que les données persistent entre appareils et sessions.

Dépannage d'un déploiement statique

La plupart des problèmes au premier déploiement viennent d'une poignée de causes. Traitez-les dans l'ordre :

  • Page blanche après déploiement : généralement un problème de chemin d'assets. Si votre bundler émet des chemins absolus (/assets/...) mais attend un sous-chemin, définissez le bon base dans votre config de build et rebuildez.
  • 404 à l'actualisation d'un lien profond : c'est le cas fallback SPA ci-dessus — confirmez que votre routeur utilise le mode history et comptez sur la réécriture automatique de jsdeck.
  • Ancienne version encore affichée : un asset en cache. Les bundlers ajoutent des hash de contenu aux noms de fichiers, donc un build frais plus un hard refresh règle le problème.
  • Avertissements mixed-content : faites en sorte que chaque requête utilise HTTPS ; jsdeck sert votre app en HTTPS, donc toute ressource http:// sera bloquée par le navigateur.

Vérifier tout cela localement avec npm run preview avant l'upload évite presque à chaque fois un aller-retour.

À qui s'adresse jsdeck, et quand ne pas l'utiliser

Bon usage : frontends statiques, single-page apps, démos, portfolios, MVPs, exports générés par IA, et apps qui ont besoin d'un peu de persistance JSON ou d'une connexion visiteur légère.

Mauvais usage : apps qui exigent un serveur Node longue durée, du rendu côté serveur à la demande, des backends WebSocket, des secrets côté serveur privés, des tâches en arrière-plan ou une base de données relationnelle complète. Pour ceux-là, une plateforme comme les alternatives discutées dans notre hub comparatifs vous servira mieux — et c'est une force de choisir délibérément, pas un compromis.

Questions fréquentes

Déployer un site SvelteKit statique est-il vraiment gratuit ?

Oui. jsdeck propose un hébergement statique gratuit avec HTTPS pour ce type de projets, sans carte bancaire requise pour commencer. Des fonctionnalités optionnelles comme le datastore et l'authentification visiteur sont disponibles quand vous en avez besoin.

Dois-je connecter un dépôt Git ?

Non. Vous pouvez uploader votre dossier de build directement dans le tableau de bord, ou déployer en ligne de commande avec jsdeck deploy. Git est optionnel.

Les routes côté client cassent-elles à l'actualisation ?

Non. jsdeck applique le fallback SPA pour que les liens profonds et les actualisations aboutissent à votre app au lieu d'un 404.

Prochaines étapes

Prêt à déployer ?

Publiez votre app statique sur une URL en ligne en quelques minutes — hébergement gratuit avec magasin de données et authentification visiteur en option.

Commencer gratuitement