Dépanner le déploiement

Déboguer et corriger les problèmes de déploiement pour les composants Webflow Code.

Quand utiliser cette compétence

Utilisez quand :

• webflow library share a échoué avec une erreur
• Les composants sont déployés mais ne fonctionnent pas correctement
• L'utilisateur partage un message d'erreur du déploiement
• Des erreurs de bundle ou de compilation se sont produites

N'utilisez PAS quand :

• Le déploiement n'a pas encore été tenté (utilisez deploy-guide à la place)
• Validation avant le déploiement (utilisez pre-deploy-check à la place)
• Problèmes généraux de qualité du code (utilisez component-audit à la place)

Instructions

Phase 1 : Recueillir les informations

1. Obtenir les détails de l'erreur :

   • Demander le message d'erreur exact
   • Demander la sortie de npx webflow library share
   • Vérifier si npx webflow library log contient des informations supplémentaires

2. Comprendre le contexte :

   • Premier déploiement ou mise à jour ?
   • Modifications récentes apportées ?
   • Fonctionnait auparavant ?

Phase 2 : Diagnostiquer

3. Identifier la catégorie d'erreur :

   • Erreurs d'authentification
   • Erreurs de build/compilation
   • Erreurs de taille de bundle
   • Erreurs réseau/téléchargement
   • Erreurs de configuration

4. Analyser la cause racine :

   • Parser le message d'erreur
   • Vérifier les causes courantes
   • Identifier le problème spécifique

Phase 3 : Fournir une solution

5. Donner un correctif spécifique :

   • Résolution étape par étape
   • Exemples de code si nécessaire
   • Étapes de vérification

6. Prévenir la récurrence :

   • Expliquer pourquoi c'est arrivé
   • Suggérer des mesures préventives

Référence d'erreurs courantes

Pour des solutions détaillées pour chaque erreur, voir references/ERROR_CATALOG.md.

Référence rapide

Correctifs les plus courants

Authentification :

# Régénérer le token, puis :
export WEBFLOW_WORKSPACE_API_TOKEN=your-new-token
npx webflow library share

Dépendances manquantes :

npm install --save-dev @webflow/webflow-cli @webflow/data-types @webflow/react

Problèmes SSR :

// Envelopper les APIs du navigateur dans useEffect ou désactiver SSR :
declareComponent(Component, { options: { ssr: false } });

Styles manquants :

// Dans .webflow.tsx, importer les styles :
import "./Component.module.css";

Commandes de débogage

# Vérifier les logs de déploiement récents
npx webflow library log

# Sortie de déploiement détaillée (affiche les erreurs détaillées)
npx webflow library share --verbose

# Vérification de type sans déployer
npx tsc --noEmit

Validation

Le problème est résolu quand tous les critères suivants sont vrais :

Directives

Processus d'analyse d'erreur

1. Lire le message d'erreur complet - Contient souvent la solution
2. Vérifier la catégorie d'erreur - Auth, build, bundle, ou runtime
3. Chercher les chemins de fichiers - Pointe vers l'emplacement exact
4. Vérifier les numéros de ligne - Pour les erreurs de code
5. Rechercher le message d'erreur - Peut être un problème connu

Quand escalader

Si aucune des solutions ne fonctionne, rassembler ces données avant d'escalader :

1. Logs de déploiement : npx webflow library log
2. Sortie détaillée : npx webflow library share --verbose
3. Version de Node.js : node -v
4. Versions de packages : npm list @webflow/webflow-cli @webflow/data-types @webflow/react
5. Configuration : Contenu de webflow.json
6. Message d'erreur : Sortie d'erreur complète (pas seulement la ligne de résumé)

Ensuite :

• Vérifier la page de statut de Webflow pour les pannes
• Rechercher dans le forum de la communauté Webflow votre message d'erreur
• Contacter Webflow Support avec les données rassemblées ci-dessus