Skip to content
Merged
Changes from all commits
Commits
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
45 changes: 44 additions & 1 deletion src/content/docs/fr/reference/experimental-flags/fonts.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -325,6 +325,49 @@ import { Font } from 'astro:assets';
<Font cssVariable="--font-roboto" preload />
```

## Accéder aux données des polices par programmation

La fonction `getFontData()` est destinée à récupérer par programmation des données de famille de polices de niveau inférieur, par exemple, dans une [route d'API](/fr/guides/endpoints/#points-de-terminaison-du-serveur-routes-api) ou pour générer vos propres balises méta.

### `getFontData()`
<p>

**Type :** `(cssVariable: CssVariable) => FontData[]`<br />
<Since v="5.14.0" />
</p>

Renvoie un tableau d'objets `FontData` pour la [variable CSS (`cssVariable`)](#cssvariable-1) fournie, qui contient `src`, `weight` et `style`.

L'exemple suivant utilise `getFontData()` pour obtenir le tampon de police à partir de l'URL lors de l'utilisation de [satori](https://github.com/vercel/satori) pour générer des images OpenGraph :

```tsx title="src/pages/og.png.ts" "getFontData(\"--font-roboto\")" "data[0].src[0].url"
import type{ APIRoute } from "astro"
import { getFontData } from "astro:assets"
import satori from "satori"

export const GET: APIRoute = (context) => {
const data = getFontData("--font-roboto")

const svg = await satori(
<div style={{ color: "black" }}>hello, world</div>,
{
width: 600,
height: 400,
fonts: [
{
name: "Roboto",
data: await fetch(new URL(data[0].src[0].url, context.url.origin)).then(res => res.arrayBuffer()),
weight: 400,
style: "normal",
},
],
},
)

// ...
}
```

## Référence de configuration des polices

Toutes les propriétés de vos polices doivent être configurées dans la configuration d'Astro. Certaines propriétés sont communes aux polices distantes et locales, tandis que d'autres sont disponibles selon le fournisseur de polices choisi.
Expand Down Expand Up @@ -801,4 +844,4 @@ Pour vider le cache en développement, supprimez le répertoire `.astro/fonts`.

## Lectures complémentaires

Pour plus de détails et pour donner votre avis sur cette API expérimentale, consultez [la RFC pour les polices](https://github.com/withastro/roadmap/blob/rfc/fonts/proposals/0052-fonts.md).
Pour plus de détails et pour donner votre avis sur cette API expérimentale, consultez [la RFC pour les polices](https://github.com/withastro/roadmap/blob/rfc/fonts/proposals/0055-fonts.md).