Aller au contenu principal
Version: 2.0.0-beta.0

Utiliser React

Docusaurus a un support intégré pour MDX, ceci vous permet d'écrire du JSX dans vos fichiers Markdown et de les rendre sous forme de composants React.

remarque

Bien que les fichiers .md et .mdx soient analysés à l'aide de MDX, certaines syntaxes sont traitées de manière légèrement différente. Pour une analyse syntaxique plus précise et un meilleur support des éditeurs, nous recommandons d'utiliser l'extension .mdx pour les fichiers contenant de la syntaxe MDX.

Essayez ce bloc ici :

export const Highlight = ({children, color}) => (
<span
style={{
backgroundColor: color,
borderRadius: '2px',
color: '#fff',
padding: '0.2rem',
}}>
{children}
</span>
);
<Highlight color="#25c2a0">Docusaurus en vert</Highlight> et <Highlight color="#1877F2">Facebook en bleu</Highlight> sont mes couleurs préférées.
Je peux écrire en **Markdown** a côté de mon _JSX_ !

Remarquez comment il rend à la fois le balisage de votre composant React et la syntaxe Markdown :

http://localhost:3000
Docusaurus en vert and Facebook en bleu sont mes couleurs préférées.

Je peux écrire en Markdown a côté de mon JSX !


Vous pouvez également importer vos propres composants définis dans d'autres fichiers ou composants tiers installés via npm ! Consultez les docs MDX pour voir ce que vous pouvez faire avec MDX.

attention

Comme tous les fichiers doc sont analysés à l'aide de MDX, tout HTML est interprété comme du JSX. Par conséquent, si vous devez donner un style en ligne à un composant, suivez le modèle JSX et fournissez des objets de style. Ce comportement est différent de Docusaurus 1. Consulter aussi la Migration de v1 vers v2.