Les classes Tailwind ne s'appliquent pas dans l'aperçu

Si une page stylisée avec des classes Tailwind CSS, comme une page de destination en mode personnalisé, semble sans style dans l’aperçu en direct de l’éditeur web, votre balisage est probablement correct. L’aperçu en direct affiche votre contenu sans étape de build et ne génère pas le CSS des classes Tailwind propres à une page.

Mintlify analyse chaque page à la recherche de classes Tailwind et génère le CSS correspondant lors du build du site. Les builds s’exécutent pour les déploiements en production, les déploiements de prévisualisation et les prévisualisations locales avec mint dev. L’aperçu en direct saute l’étape de build afin de pouvoir s’afficher instantanément ; le CSS de vos classes Tailwind n’y est donc jamais généré.

Si vous inspectez un élément dans l’aperçu en direct, les classes Tailwind apparaissent dans le HTML avec un préfixe mint-, mais aucune règle CSS ne leur correspond.

Pour vérifier le rendu d’une page stylisée avec Tailwind, utilisez une prévisualisation qui inclut un build :

• Exécutez mint dev dans votre dépôt local.
• Enregistrez vos modifications sur une branche et ouvrez une pull request. Mintlify génère un déploiement de prévisualisation avec une URL partageable.
• Publiez vos modifications et vérifiez votre site en ligne.

Si la page semble toujours incorrecte dans l’une de ces prévisualisations, le problème vient de la page elle-même. Consultez Créer des mises en page personnalisées pour des modèles fonctionnels.

Indépendamment du comportement de l’aperçu en direct, le mode personnalisé est une toile vierge. Mintlify n’applique pas sa typographie par défaut aux pages en mode personnalisé ; les éléments HTML natifs comme <h2> et <p> s’affichent donc avec les styles par défaut du navigateur sur chaque prévisualisation et chaque déploiement. Stylisez-les explicitement :

<h2 className="text-2xl font-semibold text-gray-900 dark:text-zinc-50">
  Features
</h2>

Il s’agit d’un comportement attendu, pas d’un bug de rendu. Consultez Créer des mises en page personnalisées pour des exemples complets.