Creation:2026-01-20Last update:2026-03-24

Référencez cette doc à votre assistant AI préféré

ChatGPT

Claude

DeepSeek

Google AI mode Gemini

Perplexity Mistral

Grok

Posez votre question et obtenez un résumé du document en referencant cette page et le Provider AI de votre choix

Historique des versions

"Add `intlayerHTML` plugin object; use `app.use(intlayerHTML)` instead of `app.use(installIntlayerHTML)`"
v8.5.024/03/2026
"déplacer l'importation de {{framework}}-intlayer vers {{framework}}-intlayer/html"
v8.5.024/03/2026
"Ajouter HTMLRenderer / useHTMLRenderer / utilitaire renderHTML"
v8.0.022/01/2026
"Ajouter le support du parsing HTML"
v8.0.020/01/2026

Le contenu de cette page a été traduit à l'aide d'une IA.

Voir la dernière version du contenu original en anglais

Edit this doc

If you have an idea for improving this documentation, please feel free to contribute by submitting a pull request on GitHub.

GitHub link to the documentation

Copy

Copy doc Markdown to clipboard

Contenu HTML / HTML dans Intlayer

Name: Intlayer
Author: Intlayer

Intlayer prend en charge le contenu HTML, vous permettant d'intégrer du contenu riche et structuré dans vos dictionnaires. Ce contenu peut être rendu avec des balises HTML standard ou remplacé par des composants personnalisés à l'exécution.

Déclarer du contenu HTML

Vous pouvez déclarer du contenu HTML à l'aide de la fonction html ou simplement sous forme de chaîne de caractères.

Utilisez la fonction html pour déclarer explicitement du contenu HTML. Cela garantit que les balises standard sont mappées correctement même si la détection automatique est désactivée.

htmlDictionary.content.ts

Copier le code

Copier le code dans le presse-papiers

import { html, type Dictionary } from "intlayer";const htmlDictionary = {  key: "app",  contentAutoTransformation: true, // peut être défini dans le fichier de configuration  content: {    myHtmlContent:  html("<p>Hello <strong>World</strong></p>"),  },} satisfies Dictionary;export default htmlDictionary;

import { html, type Dictionary } from "intlayer";const htmlDictionary = {  key: "app",  contentAutoTransformation: true, // peut être défini dans le fichier de configuration  content: {    myHtmlContent:  html("<p>Hello <strong>World</strong></p>"),  },} satisfies Dictionary;export default htmlDictionary;

Si la chaîne contient des balises HTML courantes (par exemple, <p>, <div>, <strong>, etc.), Intlayer la transformera automatiquement.

htmlDictionary.content.ts

Copier le code

Copier le code dans le presse-papiers

export default {  key: "app",  contentAutoTransformation: true, // peut être défini dans le fichier de configuration  content: {    myHtmlContent:  "<p>Hello <strong>World</strong></p>",  },};

export default {  key: "app",  contentAutoTransformation: true, // peut être défini dans le fichier de configuration  content: {    myHtmlContent:  "<p>Hello <strong>World</strong></p>",  },};

Importez du contenu HTML à partir de fichiers. Notez qu'actuellement la fonction file() renvoie une chaîne, qui sera automatiquement détectée comme HTML si elle contient des balises.

htmlDictionary.content.ts

Copier le code

Copier le code dans le presse-papiers

import { html, file, t } from "intlayer";export default {  key: "app",  content: {    content: t({      en: html(file("./content.en.html")),      fr: html(file("./content.fr.html")),    }),  },};

import { html, file, t } from "intlayer";export default {  key: "app",  content: {    content: t({      en: html(file("./content.en.html")),      fr: html(file("./content.fr.html")),    }),  },};

Le nœud `html()`

La fonction html() est une nouvelle fonctionnalité d'Intlayer v8 qui vous permet de définir explicitement du contenu HTML dans vos dictionnaires. Bien qu'Intlayer puisse souvent détecter automatiquement le contenu HTML, l'utilisation de la fonction html() offre plusieurs avantages :

Sécurité de typage : La fonction html() vous permet de définir les props attendues pour les composants personnalisés, offrant une meilleure autocomplétion et une vérification de type dans votre éditeur.
Déclaration explicite : Elle garantit qu'une chaîne est toujours traitée comme du HTML, même si elle ne contient pas de balises HTML standard qui déclencheraient l'auto-détection.
Définition de composants personnalisés : Vous pouvez passer un deuxième argument à html() pour définir les composants personnalisés et leurs types de props attendus.

typescript

Copier le code

Copier le code dans le presse-papiers

import { html } from "intlayer";const myContent = html(  "<MyCustomComponent title='Bonjour'>Monde</MyCustomComponent>",  {    MyCustomComponent: {      title: "string",      children: "node",    },  });

import { html } from "intlayer";const myContent = html(  "<MyCustomComponent title='Bonjour'>Monde</MyCustomComponent>",  {    MyCustomComponent: {      title: "string",      children: "node",    },  });

Lors de l'utilisation de la méthode .use() sur un nœud HTML, les composants que vous fournissez seront vérifiés par rapport à la définition fournie dans la fonction html() (si disponible).

Rendu du HTML

Le rendu peut être géré automatiquement par le système de contenu d'Intlayer ou manuellement à l'aide d'outils spécialisés.

Rendu Automatique (en utilisant `useIntlayer`)

Lorsque vous accédez au contenu via useIntlayer, les nœuds HTML sont déjà préparés pour le rendu.

Les nœuds HTML peuvent être rendus directement en JSX. Les balises standard fonctionnent automatiquement.

App.tsx

Copier le code

Copier le code dans le presse-papiers

import { useIntlayer } from "react-intlayer";const AppContent = () => {  const { myHtmlContent } = useIntlayer("app");  return <div>{myHtmlContent}</div>;};

import { useIntlayer } from "react-intlayer";const AppContent = () => {  const { myHtmlContent } = useIntlayer("app");  return <div>{myHtmlContent}</div>;};

Utilisez la méthode .use() pour fournir des composants personnalisés ou remplacer des balises :

tsx

Copier le code

Copier le code dans le presse-papiers

{myHtmlContent.use({  p: (props) => <p className="prose" {...props} />,  CustomLink: ({ children }) => <a href="/details">{children}</a>,})}

{myHtmlContent.use({  p: (props) => <p className="prose" {...props} />,  CustomLink: ({ children }) => <a href="/details">{children}</a>,})}

Dans Vue, le contenu HTML peut être rendu à l'aide du composant intégré component.

App.vue

Copier le code

Copier le code dans le presse-papiers

<script setup>import { useIntlayer } from "vue-intlayer";const { myHtmlContent } = useIntlayer("app");</script><template>  <component :is="myHtmlContent" /></template>

<script setup>import { useIntlayer } from "vue-intlayer";const { myHtmlContent } = useIntlayer("app");</script><template>  <component :is="myHtmlContent" /></template>

Utilisez .use() pour les remplacements :

vue

Copier le code

Copier le code dans le presse-papiers

<component :is="myHtmlContent.use({ h1: 'h2' })" />

<component :is="myHtmlContent.use({ h1: 'h2' })" />

Svelte rend les nœuds HTML sous forme de chaînes de caractères. Utilisez {@html} pour les rendre.

svelte

Copier le code

Copier le code dans le presse-papiers

<script lang="ts">import { useIntlayer } from "svelte-intlayer";const content = useIntlayer("app");</script>{@html $content.myHtmlContent}

<script lang="ts">import { useIntlayer } from "svelte-intlayer";const content = useIntlayer("app");</script>{@html $content.myHtmlContent}

Preact prend en charge les nœuds HTML directement dans le JSX.

App.tsx

Copier le code

Copier le code dans le presse-papiers

import { useIntlayer } from "preact-intlayer";const AppContent = () => {  const { myHtmlContent } = useIntlayer("app");  return <div>{myHtmlContent}</div>;};

import { useIntlayer } from "preact-intlayer";const AppContent = () => {  const { myHtmlContent } = useIntlayer("app");  return <div>{myHtmlContent}</div>;};

Solid prend en charge les nœuds HTML directement dans le JSX.

App.tsx

Copier le code

Copier le code dans le presse-papiers

import { useIntlayer } from "solid-intlayer";const AppContent = () => {  const { myHtmlContent } = useIntlayer("app");  return <div>{myHtmlContent}</div>;};

import { useIntlayer } from "solid-intlayer";const AppContent = () => {  const { myHtmlContent } = useIntlayer("app");  return <div>{myHtmlContent}</div>;};

Angular utilise la directive [innerHTML] pour rendre le contenu HTML.

app.component.ts

Copier le code

Copier le code dans le presse-papiers

import { Component } from "@angular/core";import { useIntlayer } from "angular-intlayer";@Component({  selector: "app-root",  template: `<div [innerHTML]="content().myHtmlContent"></div>`,})export class AppComponent {  content = useIntlayer("app");}

import { Component } from "@angular/core";import { useIntlayer } from "angular-intlayer";@Component({  selector: "app-root",  template: `<div [innerHTML]="content().myHtmlContent"></div>`,})export class AppComponent {  content = useIntlayer("app");}

Utilisez la méthode .use() pour fournir des composants personnalisés ou remplacer des balises :

typescript

Copier le code

Copier le code dans le presse-papiers

content().myHtmlContent.use({  p: { class: "prose" },  CustomLink: { href: "/details" },})

content().myHtmlContent.use({  p: { class: "prose" },  CustomLink: { href: "/details" },})

Configuration Globale avec `HTMLProvider`

Vous pouvez configurer le rendu HTML globalement pour l'ensemble de votre application. C'est idéal pour définir des composants personnalisés qui doivent être disponibles dans tout le contenu HTML.

AppProvider.tsx

Copier le code

Copier le code dans le presse-papiers

import { HTMLProvider } from "react-intlayer/html";export const AppProvider = ({ children }) => (  <HTMLProvider    components={{      p: (props) => <p className="prose" {...props} />,      CustomLink: ({ children }) => <a href="/details">{children}</a>,    }}  >    {children}  </HTMLProvider>);

import { HTMLProvider } from "react-intlayer/html";export const AppProvider = ({ children }) => (  <HTMLProvider    components={{      p: (props) => <p className="prose" {...props} />,      CustomLink: ({ children }) => <a href="/details">{children}</a>,    }}  >    {children}  </HTMLProvider>);

Vous pouvez également utiliser votre propre moteur de rendu HTML :

AppProvider.tsx

Copier le code

Copier le code dans le presse-papiers

import { HTMLProvider } from "react-intlayer/html";export const AppProvider = ({ children }) => (  <HTMLProvider    renderHTML={async (html) => {      const { renderHTML } = await import('react-intlayer/html');      return renderHTML(html);    }}  >    {children}  </HTMLProvider>);

import { HTMLProvider } from "react-intlayer/html";export const AppProvider = ({ children }) => (  <HTMLProvider    renderHTML={async (html) => {      const { renderHTML } = await import('react-intlayer/html');      return renderHTML(html);    }}  >    {children}  </HTMLProvider>);

L'importation dynamique de votre moteur de rendu HTML est un bon moyen de réduire la taille du bundle de votre application.

main.ts

Copier le code

Copier le code dans le presse-papiers

import { createApp, h } from "vue";import { intlayer } from "vue-intlayer";import { intlayerHTML } from "vue-intlayer/html";import App from "./App.vue";const app = createApp(App);app.use(intlayer);app.use(intlayerHTML, {  components: {    p: (props, { slots }) => h("p", { class: "prose", ...props }, slots.default?.()),    CustomLink: (props, { slots }) => h("a", { href: "/details", ...props }, slots.default?.()),  },});app.mount("#app");

import { createApp, h } from "vue";import { intlayer } from "vue-intlayer";import { intlayerHTML } from "vue-intlayer/html";import App from "./App.vue";const app = createApp(App);app.use(intlayer);app.use(intlayerHTML, {  components: {    p: (props, { slots }) => h("p", { class: "prose", ...props }, slots.default?.()),    CustomLink: (props, { slots }) => h("a", { href: "/details", ...props }, slots.default?.()),  },});app.mount("#app");

Vous pouvez également utiliser votre propre moteur de rendu HTML :

main.ts

Copier le code

Copier le code dans le presse-papiers

import { createApp, h } from "vue";import { intlayer } from "vue-intlayer";import { intlayerHTML } from "vue-intlayer/html";import App from "./App.vue";const app = createApp(App);app.use(intlayer);app.use(intlayerHTML, {  renderHTML: async (html) => {    const { renderHTML } = await import('vue-intlayer/html');    return renderHTML(html);  },});app.mount("#app");

import { createApp, h } from "vue";import { intlayer } from "vue-intlayer";import { intlayerHTML } from "vue-intlayer/html";import App from "./App.vue";const app = createApp(App);app.use(intlayer);app.use(intlayerHTML, {  renderHTML: async (html) => {    const { renderHTML } = await import('vue-intlayer/html');    return renderHTML(html);  },});app.mount("#app");

L'importation dynamique de votre moteur de rendu HTML est un bon moyen de réduire la taille du bundle de votre application.

App.svelte

Copier le code

Copier le code dans le presse-papiers

 <script lang="ts">   import { HTMLProvider } from "svelte-intlayer/html";   import MyCustomP from "./MyCustomP.svelte"; </script> <HTMLProvider   components={{     p: MyCustomP,   }} >   <slot /> </HTMLProvider>

 <script lang="ts">   import { HTMLProvider } from "svelte-intlayer/html";   import MyCustomP from "./MyCustomP.svelte"; </script> <HTMLProvider   components={{     p: MyCustomP,   }} >   <slot /> </HTMLProvider>

Vous pouvez également utiliser votre propre moteur de rendu HTML :

App.svelte

Copier le code

Copier le code dans le presse-papiers

 <script lang="ts">   import { HTMLProvider } from "svelte-intlayer/html"; </script> <HTMLProvider   renderHTML={async (html) => {     const { renderHTML } = await import('svelte-intlayer/html');     return renderHTML(html);   }} >   <slot /> </HTMLProvider>

 <script lang="ts">   import { HTMLProvider } from "svelte-intlayer/html"; </script> <HTMLProvider   renderHTML={async (html) => {     const { renderHTML } = await import('svelte-intlayer/html');     return renderHTML(html);   }} >   <slot /> </HTMLProvider>

> L'importation dynamique de votre moteur de rendu HTML est un bon moyen de réduire la taille du bundle de votre application.

AppProvider.tsx

Copier le code

Copier le code dans le presse-papiers

 import { HTMLProvider } from "preact-intlayer/html"; export const AppProvider = ({ children }) => (   <HTMLProvider     components={{       p: (props) => <p className="prose" {...props} />,     }}   >     {children}   </HTMLProvider> );

 import { HTMLProvider } from "preact-intlayer/html"; export const AppProvider = ({ children }) => (   <HTMLProvider     components={{       p: (props) => <p className="prose" {...props} />,     }}   >     {children}   </HTMLProvider> );

Vous pouvez également utiliser votre propre moteur de rendu HTML :

AppProvider.tsx

Copier le code

Copier le code dans le presse-papiers

 import { HTMLProvider } from "preact-intlayer/html"; export const AppProvider = ({ children }) => (   <HTMLProvider     renderHTML={async (html) => {       const { renderHTML } = await import('preact-intlayer/html');       return renderHTML(html);     }}   >     {children}   </HTMLProvider> );

 import { HTMLProvider } from "preact-intlayer/html"; export const AppProvider = ({ children }) => (   <HTMLProvider     renderHTML={async (html) => {       const { renderHTML } = await import('preact-intlayer/html');       return renderHTML(html);     }}   >     {children}   </HTMLProvider> );

> L'importation dynamique de votre moteur de rendu HTML est un bon moyen de réduire la taille du bundle de votre application.

AppProvider.tsx

Copier le code

Copier le code dans le presse-papiers

 import { HTMLProvider } from "solid-intlayer/html"; export const AppProvider = (props) => (   <HTMLProvider     components={{       p: (props) => <p className="prose" {...props} />,     }}   >     {props.children}   </HTMLProvider> );

 import { HTMLProvider } from "solid-intlayer/html"; export const AppProvider = (props) => (   <HTMLProvider     components={{       p: (props) => <p className="prose" {...props} />,     }}   >     {props.children}   </HTMLProvider> );

Vous pouvez également utiliser votre propre moteur de rendu HTML :

AppProvider.tsx

Copier le code

Copier le code dans le presse-papiers

 import { HTMLProvider } from "solid-intlayer/html"; export const AppProvider = (props) => (   <HTMLProvider     renderHTML={async (html) => {       const { renderHTML } = await import('solid-intlayer/html');       return renderHTML(html);     }}   >     {props.children}   </HTMLProvider> );

 import { HTMLProvider } from "solid-intlayer/html"; export const AppProvider = (props) => (   <HTMLProvider     renderHTML={async (html) => {       const { renderHTML } = await import('solid-intlayer/html');       return renderHTML(html);     }}   >     {props.children}   </HTMLProvider> );

> L'importation dynamique de votre moteur de rendu HTML est un bon moyen de réduire la taille du bundle de votre application.

app.config.ts

Copier le code

Copier le code dans le presse-papiers

import { createIntlayerHTMLProvider } from "angular-intlayer/html";export const appConfig: ApplicationConfig = {  providers: [    createIntlayerHTMLProvider({      components: {        p: { class: "prose" },        CustomLink: { href: "/details" },      },    }),  ],};

import { createIntlayerHTMLProvider } from "angular-intlayer/html";export const appConfig: ApplicationConfig = {  providers: [    createIntlayerHTMLProvider({      components: {        p: { class: "prose" },        CustomLink: { href: "/details" },      },    }),  ],};

Vous pouvez également utiliser votre propre moteur de rendu HTML :

app.config.ts

Copier le code

Copier le code dans le presse-papiers

import { createIntlayerHTMLProvider } from "angular-intlayer/html";export const appConfig: ApplicationConfig = {  providers: [    createIntlayerHTMLProvider({      renderMarkdown: async (html) => {        const { renderMarkdown } = await import('angular-intlayer/html');        return renderMarkdown(html);      },    }),  ],};

import { createIntlayerHTMLProvider } from "angular-intlayer/html";export const appConfig: ApplicationConfig = {  providers: [    createIntlayerHTMLProvider({      renderMarkdown: async (html) => {        const { renderMarkdown } = await import('angular-intlayer/html');        return renderMarkdown(html);      },    }),  ],};

L'importation dynamique de votre moteur de rendu HTML est un bon moyen de réduire la taille du bundle de votre application.

Rendu Manuel et Outils Avancés

Si vous avez besoin de rendre des chaînes HTML brutes ou si vous voulez plus de contrôle sur le mappage des composants, utilisez les outils suivants.

Composant `<HTMLRenderer />`

Rendre une chaîne HTML avec des composants spécifiques.

tsx

Copier le code

Copier le code dans le presse-papiers

import { HTMLRenderer } from "react-intlayer/html";<HTMLRenderer components={{ p: MyCustomP }}>  {"<p>Hello World</p>"}</HTMLRenderer>

import { HTMLRenderer } from "react-intlayer/html";<HTMLRenderer components={{ p: MyCustomP }}>  {"<p>Hello World</p>"}</HTMLRenderer>

Hook `useHTMLRenderer()`

Obtenir une fonction de rendu pré-configurée.

tsx

Copier le code

Copier le code dans le presse-papiers

import { useHTMLRenderer } from "react-intlayer/html";const renderHTML = useHTMLRenderer({  components: { strong: (props) => <strong {...props} className="text-red-500" /> }});return renderHTML("<p>Hello <strong>World</strong></p>");

import { useHTMLRenderer } from "react-intlayer/html";const renderHTML = useHTMLRenderer({  components: { strong: (props) => <strong {...props} className="text-red-500" /> }});return renderHTML("<p>Hello <strong>World</strong></p>");

Utilitaire `renderHTML()`

Utilitaire autonome pour le rendu en dehors des composants.

tsx

Copier le code

Copier le code dans le presse-papiers

import { renderHTML } from "react-intlayer/html";const jsx = renderHTML("<p>Hello</p>", { components: { p: 'div' } });

import { renderHTML } from "react-intlayer/html";const jsx = renderHTML("<p>Hello</p>", { components: { p: 'div' } });

#### Composant

<HTMLRenderer />

vue

Copier le code

Copier le code dans le presse-papiers

 <script setup> import { HTMLRenderer } from "vue-intlayer/html"; </script> <template>   <HTMLRenderer content="<p>Hello World</p>" /> </template>

 <script setup> import { HTMLRenderer } from "vue-intlayer/html"; </script> <template>   <HTMLRenderer content="<p>Hello World</p>" /> </template>

Composant `<HTMLRenderer />`

svelte

Copier le code

Copier le code dans le presse-papiers

<script lang="ts">import { HTMLRenderer } from "svelte-intlayer/html";</script><HTMLRenderer value="<p>Hello World</p>" />

<script lang="ts">import { HTMLRenderer } from "svelte-intlayer/html";</script><HTMLRenderer value="<p>Hello World</p>" />

Hook `useHTMLRenderer()`

svelte

Copier le code

Copier le code dans le presse-papiers

<script lang="ts">import { useHTMLRenderer } from "svelte-intlayer/html";const render = useHTMLRenderer();</script>{@html render("<p>Hello World</p>")}

<script lang="ts">import { useHTMLRenderer } from "svelte-intlayer/html";const render = useHTMLRenderer();</script>{@html render("<p>Hello World</p>")}

Utilitaire `renderHTML()`

svelte

Copier le code

Copier le code dans le presse-papiers

<script lang="ts">import { renderHTML } from "svelte-intlayer/html";</script>{@html renderHTML("<p>Hello World</p>")}

<script lang="ts">import { renderHTML } from "svelte-intlayer/html";</script>{@html renderHTML("<p>Hello World</p>")}

#### Composant

<HTMLRenderer />

tsx

Copier le code

Copier le code dans le presse-papiers

 import { HTMLRenderer } from "preact-intlayer/html"; <HTMLRenderer>   {"<p>Hello World</p>"} </HTMLRenderer>

 import { HTMLRenderer } from "preact-intlayer/html"; <HTMLRenderer>   {"<p>Hello World</p>"} </HTMLRenderer>

#### Hook

useHTMLRenderer()

tsx

Copier le code

Copier le code dans le presse-papiers

 import { useHTMLRenderer } from "preact-intlayer/html"; const render = useHTMLRenderer(); return <div>{render("<p>Hello World</p>")}</div>;

 import { useHTMLRenderer } from "preact-intlayer/html"; const render = useHTMLRenderer(); return <div>{render("<p>Hello World</p>")}</div>;

#### Utilitaire

renderHTML()

tsx

Copier le code

Copier le code dans le presse-papiers

 import { renderHTML } from "preact-intlayer/html"; return <div>{renderHTML("<p>Hello World</p>")}</div>;

 import { renderHTML } from "preact-intlayer/html"; return <div>{renderHTML("<p>Hello World</p>")}</div>;

#### Composant

<HTMLRenderer />

tsx

Copier le code

Copier le code dans le presse-papiers

 import { HTMLRenderer } from "solid-intlayer/html"; <HTMLRenderer>   {"<p>Hello World</p>"} </HTMLRenderer>

 import { HTMLRenderer } from "solid-intlayer/html"; <HTMLRenderer>   {"<p>Hello World</p>"} </HTMLRenderer>

#### Hook

useHTMLRenderer()

tsx

Copier le code

Copier le code dans le presse-papiers

 import { useHTMLRenderer } from "solid-intlayer/html"; const render = useHTMLRenderer(); return <div>{render("<p>Hello World</p>")}</div>;

 import { useHTMLRenderer } from "solid-intlayer/html"; const render = useHTMLRenderer(); return <div>{render("<p>Hello World</p>")}</div>;

#### Utilitaire

renderHTML()

tsx

Copier le code

Copier le code dans le presse-papiers

 import { renderHTML } from "solid-intlayer/html"; return <div>{renderHTML("<p>Hello World</p>")}</div>;

 import { renderHTML } from "solid-intlayer/html"; return <div>{renderHTML("<p>Hello World</p>")}</div>;

Service `IntlayerHTMLService`

Rendre une chaîne HTML à l'aide du service.

typescript

Copier le code

Copier le code dans le presse-papiers

import { IntlayerHTMLService } from "angular-intlayer/html";export class MyComponent {  constructor(private markdownService: IntlayerHTMLService) {}  renderHTML(html: string) {    return this.markdownService.renderMarkdown(html);  }}

import { IntlayerHTMLService } from "angular-intlayer/html";export class MyComponent {  constructor(private markdownService: IntlayerHTMLService) {}  renderHTML(html: string) {    return this.markdownService.renderMarkdown(html);  }}

Référence des Options

Ces options peuvent être passées à HTMLProvider, HTMLRenderer, useHTMLRenderer et renderHTML.

Afficher tout le contenu du tableau

Ouvrir le tableau dans une fenêtre modale pour voir tout le contenu clairement

Option	Type	Défaut	Description
`components`	`Record<string, any>`	`{}`	Une carte des balises HTML ou des noms de composants personnalisés vers les composants.
`renderHTML`	`Function`	`null`	Une fonction de rendu personnalisée pour remplacer complètement le parseur HTML par défaut (uniquement pour Vue/Svelte).

Note : Pour React et Preact, les balises HTML standard sont fournies automatiquement. Vous n'avez besoin de passer la prop components que si vous souhaitez les remplacer ou ajouter des composants personnalisés.

Markdown

Récupération de fonction

Historique des versions

Contenu HTML / HTML dans Intlayer

Déclarer du contenu HTML

Le nœud html()

Rendu du HTML

Rendu Automatique (en utilisant useIntlayer)

Configuration Globale avec HTMLProvider

Rendu Manuel et Outils Avancés

Composant <HTMLRenderer />

Hook useHTMLRenderer()

Utilitaire renderHTML()

Référence des Options

Le nœud `html()`

Rendu Automatique (en utilisant `useIntlayer`)

Configuration Globale avec `HTMLProvider`

Composant `<HTMLRenderer />`

Hook `useHTMLRenderer()`

Utilitaire `renderHTML()`