Skip to content

i18n(fr): add renderer-reference.mdx & update integrations-reference.mdx #13740

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ArmandPhilippot wants to merge 2 commits into
base: main
Choose a base branch
from
Open

i18n(fr): add renderer-reference.mdx & update integrations-reference.mdx #13740

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
415344d
i18n(fr): translate `renderer-reference.mdx`
ArmandPhilippot Apr 16, 2026
6edd9eb
clean up `integrations-reference.mdx`
ArmandPhilippot Apr 16, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
200 changes: 4 additions & 196 deletions src/content/docs/fr/reference/integrations-reference.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -194,18 +194,11 @@ export default {

<p>

**Type :** <code>(renderer: <a href="#astrorenderer">AstroRenderer</a>) => void;</code><br />
**Type :** <code>(renderer: <a href="/fr/reference/renderer-reference/#astrorenderer">AstroRenderer</a>) => void;</code><br />
**Exemples :** [`svelte`](https://github.com/withastro/astro/blob/main/packages/integrations/svelte/src/index.ts), [`react`](https://github.com/withastro/astro/blob/main/packages/integrations/react/src/index.ts), [`preact`](https://github.com/withastro/astro/blob/main/packages/integrations/preact/src/index.ts), [`vue`](https://github.com/withastro/astro/blob/main/packages/integrations/vue/src/index.ts), [`solid`](https://github.com/withastro/astro/blob/main/packages/integrations/solid/src/index.ts)
</p>

Une fonction de rappel pour ajouter un moteur de rendu de composants de framework (c'est-à-dire React, Vue, Svelte, etc.). Vous pouvez consulter les exemples et la définition des types ci-dessus pour des options plus avancées, mais voici les deux principales options à connaître :

- `clientEntrypoint` - chemin d'accès à un fichier qui s'exécute sur le client chaque fois que votre composant est utilisé. Ce fichier sert principalement à afficher ou à hydrater votre composant avec JS.
- `serverEntrypoint` - chemin d'accès à un fichier qui s'exécute lors des requêtes côté serveur ou des compilations statiques, chaque fois que votre composant est utilisé. Ces fichiers devraient restituer les composants en un balisage statique, avec des hooks d'hydratation, le cas échéant. [Le callback `renderToString` de React](https://react.dev/reference/react-dom/server/renderToString) est un exemple classique.

<p><Since v="5.0.0" /></p>

Les fonctions `clientEntrypoint` et `serverEntrypoint` acceptent une `URL`.
Une fonction de rappel pour [ajouter un moteur de rendu de composants de framework](/fr/reference/renderer-reference/) (c'est-à-dire React, Vue, Svelte, etc.).

#### Option `addWatchFile()`

Expand Down Expand Up @@ -1438,7 +1431,6 @@ import type {
AstroIntegrationMiddleware,
AstroMiddlewareInstance,
AstroPrerenderer,
AstroRenderer,
ClientDirectiveConfig,
HookParameters,
IntegrationResolvedRoute,
Expand All @@ -1447,8 +1439,6 @@ import type {
RoutePart,
RouteType,
SSRComponentMetadata,
SSRLoadedRenderer,
SSRLoadedRendererValue,
SSRManifest,
ValidRedirectStatus,
} from "astro";
Expand Down Expand Up @@ -1608,42 +1598,6 @@ Définit une méthode facultative décrivant comment afficher une page. Celle-ci

Définit une méthode facultative appelée une fois que toutes les pages sont pré-rendues. Ceci est utile pour effectuer des tâches de nettoyage telles que l'arrêt d'un serveur de prévisualisation.

### `AstroRenderer`

<p>

**Type :** `{ name: string; clientEntrypoint?: string | URL; serverEntrypoint: string | URL; }`
</p>

Décrit un [moteur de rendu de composants de framework ajouté par une intégration](#option-addrenderer).

#### `AstroRenderer.name`

<p>

**Type :** `string`
</p>

Le nom du moteur de rendu de composants de framework.

#### `AstroRenderer.clientEntrypoint`

<p>

**Type :** `string | URL`
</p>

Définit le chemin d'importation du moteur de rendu qui s'exécute côté client chaque fois que votre composant est utilisé.

#### `AstroRenderer.serverEntrypoint`

<p>

**Type :** `string | URL`
</p>

Définit le chemin d'importation du moteur de rendu qui s'exécute lors des requêtes côté serveur ou des compilations statiques chaque fois que votre composant est utilisé.

### `ClientDirectiveConfig`

<p>
Expand Down Expand Up @@ -2028,152 +1982,6 @@ Une description de la manière d'afficher le contenu de l'en-tête à partir de

Détermine si le composant contient le contenu de l'en-tête.

### `SSRLoadedRenderer`

<p>

**Type :** `{ name: string; clientEntrypoint?: string | URL; ssr: SSRLoadedRendererValue; }`
</p>

Décrit un moteur de rendu disponible pour le serveur. Il s'agit d'un sous-ensemble de [`AstroRenderer`](#astrorenderer) avec des propriétés supplémentaires.

#### `SSRLoadedRenderer.ssr`

<p>

**Type :** [`SSRLoadedRendererValue`](#ssrloadedrenderervalue)
</p>

Définit les fonctions et la configuration utilisées par le serveur pour ce framework.

### `SSRLoadedRendererValue`

Contient les fonctions et la configuration nécessaires pour générer les composants sur le serveur à partir d'un framework d'interface utilisateur spécifique.

#### `SSRLoadedRendererValue.name`

<p>

**Type :** `string`
</p>

Spécifie le nom identifiant le moteur de rendu.

#### `SSRLoadedRendererValue.check()`

<p>

**Type :** `(Component: any, props: Record<string, any>, children: Record<string, string>, metadata?: AstroComponentMetadata) => Promise<boolean>`
</p>

Détermine si le moteur de rendu doit gérer le composant. Appelée pour chaque moteur de rendu enregistré jusqu'à ce que l'un d'eux renvoie `true`.

La fonction reçoit le constructeur ou la fonction du composant, ses propriétés, le contenu du slot et un objet optionnel [`metadata`](#astrocomponentmetadata) contenant des informations sur la directive d'hydratation et la source du composant.

#### `SSRLoadedRendererValue.renderToStaticMarkup()`

<p>

**Type :** `(Component: any, props: Record<string, any>, children: Record<string, string>, metadata?: AstroComponentMetadata) => Promise<{ html: string; attrs?: Record<string, string>; }>`
</p>

Génère un composant de framework sous forme de balisage HTML statique sur le serveur.

La fonction reçoit le constructeur ou la fonction du composant, ses propriétés, le contenu du slot et un objet [`metadata`](#astrocomponentmetadata) optionnel. Les moteurs de rendu peuvent utiliser `metadata` pour déterminer si le composant sera hydraté côté client, ce qui peut s'avérer utile pour inclure conditionnellement l'état d'hydratation côté client.

#### `SSRLoadedRendererValue.supportsAstroStaticSlot`

<p>

**Type :** `boolean`<br />
<Since v="2.5.0" />
</p>

Indique si le moteur de rendu prend en charge l'optimisation des slots statiques d'Astro. Lorsque cette option est activée, Astro empêche la suppression des slots imbriqués au sein des îlots.

#### `SSRLoadedRendererValue.renderHydrationScript()`

<p>

**Type :** `() => string`<br />
<Since v="4.1.0" />
</p>

Renvoie un script d'hydratation spécifique au framework qui doit être injecté dans le HTML avant le premier composant utilisant ce moteur de rendu.

### `AstroComponentMetadata`

<p>

**Type :** `{ displayName: string; hydrate?: 'load' | 'idle' | 'visible' | 'media' | 'only'; hydrateArgs?: any; componentUrl?: string; componentExport?: { value: string; namespace?: boolean }; astroStaticSlot: true; }`
</p>

Un objet transmis en tant que quatrième argument aux fonctions [`check()`](#ssrloadedrenderervaluecheck) et [`renderToStaticMarkup()`](#ssrloadedrenderervaluerendertostaticmarkup) d'un moteur de rendu. Contient des informations sur le composant rendu, y compris sa directive d'hydratation.

#### `AstroComponentMetadata.displayName`

<p>

**Type :** `string`
</p>

Le nom d'affichage du composant, utilisé pour les messages d'erreur et le débogage.

#### `AstroComponentMetadata.hydrate`

<p>

**Type :** `'load' | 'idle' | 'visible' | 'media' | 'only' | undefined`
</p>

La [directive client](/fr/reference/directives-reference/#directives-client) utilisée sur le composant, le cas échéant. Lorsque la valeur est `undefined`, le composant ne sera pas hydraté côté client.

Les moteurs de rendu peuvent utiliser cette valeur pour inclure conditionnellement l'état d'hydratation côté client. Par exemple, un moteur de rendu peut ignorer la sérialisation de l'état de transfert pour les composants qui ne seront pas hydratés :

```ts
async function renderToStaticMarkup(Component, props, children, metadata) {
const willHydrate = !!metadata?.hydrate;
// Ignorer la sérialisation de l'état d'hydratation quand le composant ne sera pas hydraté.
return render(Component, props, { includeTransferState: willHydrate });
}
```

#### `AstroComponentMetadata.hydrateArgs`

<p>

**Type :** `any`
</p>

Arguments supplémentaires pour la directive d'hydratation. Par exemple, la valeur de `client:media="(max-width: 768px)"` serait `"(max-width: 768px)"`. Pour `client:only="react"`, la valeur serait `"react"`.

#### `AstroComponentMetadata.componentUrl`

<p>

**Type :** `string | undefined`
</p>

L'URL du fichier source du composant.

#### `AstroComponentMetadata.componentExport`

<p>

**Type :** `{ value: string; namespace?: boolean } | undefined`
</p>

Informations relatives à l'exportation du composant. La propriété `value` correspond au nom de l'exportation (par exemple, `"default"` pour les exportations par défaut).

#### `AstroComponentMetadata.astroStaticSlot`

<p>

**Type :** `true`
</p>

Toujours `true`. Indique qu'Astro prend en charge l'optimisation statique des slots pour ce composant. Les moteurs de rendu qui définissent [`supportsAstroStaticSlot`](#ssrloadedrenderervaluesupportsastrostaticslot) sur `true` peuvent l'utiliser en combinaison avec [`hydrate`](#astrocomponentmetadatahydrate) pour déterminer comment rendre les slots.

### `SSRManifest`

Un objet contenant la configuration de compilation et les métadonnées du projet que les adaptateurs serveur utilisent au moment de l'exécution pour servir des pages rendues à la demande.
Expand Down Expand Up @@ -2314,7 +2122,7 @@ Spécifie le [préfixe configuré pour les liens vers les ressources générées

<p>

**Type :** <code><a href="#ssrloadedrenderer">SSRLoadedRenderer</a>[]</code>
**Type :** <code><a href="/fr/reference/renderer-reference/#ssrloadedrenderer">SSRLoadedRenderer</a>[]</code>
</p>

Une liste des moteurs de rendu (par exemple React, Vue, Svelte, MDX) disponibles pour le serveur.
Expand Down Expand Up @@ -2381,7 +2189,7 @@ Définit une correspondance entre les identifiants des composants et leurs méta

<p>

**Type :** `{ page: ImportComponentInstance; onRequest?: MiddlewareHandler; renderers: SSRLoadedRenderer[]; }`<br />
**Type :** `{ page: ImportComponentInstance; onRequest?: MiddlewareHandler; }`<br />
<Since v="2.7.0" />
</p>

Expand Down
Loading
Loading