# Des sites en plusieurs langues Un seul site, toutes les langues dont vous avez besoin.

> vagejs, générateur de sites statiques multilingues : un dossier par langue, lang et hreflang sur chaque page, et une vérification des traductions manquantes.

vagejs est un générateur de sites statiques qui intègre les sites multilingues. Un seul site contient toutes les langues, chacune dans son propre dossier, avec les bonnes balises de langue et `hreflang` sur chaque page, et une vérification qui liste les pages encore en attente de traduction. Cette fonctionnalité fait partie de vagejs depuis la version 0.10.

`npm create vagejs@latest my-site`

[Lire la documentation multilingue](https://vagejs.com/docs/multi-language/)[Suivre le guide pas à pas](https://vagejs.com/guides/multilingual-static-site/)

## Comment ça marche

Vos visiteurs ne lisent pas tous la même langue. Vos pages en anglais restent exactement là où elles sont, les pages en français vont dans un dossier `fr`, et les pages en allemand dans `de`. Chaque page connaît sa langue, et les traductions pointent les unes vers les autres.

| Vous écrivez | Les visiteurs obtiennent |
| --- | --- |
| `src/pages/about.md` | `/about/`, en anglais |
| `src/pages/fr/about.md` | `/fr/about/`, la version française |
| `src/pages/de/ueber-uns.md` avec `translationOf: /about/` | `/de/ueber-uns/`, la version allemande, avec sa propre adresse en allemand |

Une page qui porte le même nom de fichier dans un dossier de langue est sa traduction. Vous voulez une adresse dans la langue du visiteur ? Ajoutez une ligne qui indique quelle page elle traduit. Vous listez vos langues une seule fois, dans `vage.config.ts` :

TypeScript

```
export default defineConfig({
  site: "https://example.com",
  lang: "en",
  i18n: { locales: ["fr", "de"] },
});
```

## Ce que vous obtenez

Nous nous occupons des détails pénibles d'un site multilingue, pour que vous puissiez vous concentrer sur les mots.

-   ### La bonne langue sur chaque page
    
    Les pages en français indiquent qu'elles sont en français : les lecteurs d'écran les prononcent correctement et les moteurs de recherche savent à qui elles s'adressent.
    
-   ### Des balises hreflang écrites pour vous
    
    Chaque version d'une page renvoie vers les autres. Google utilise ces liens pour montrer aux gens la version dans leur propre langue.
    
-   ### Un sélecteur de langue sans comptabilité
    
    Votre layout reçoit la liste des traductions de la page qu'il affiche, si bien qu'un sélecteur pointe toujours vers des pages qui existent.
    
-   ### Une vérification des traductions manquantes
    
    `npm run check` liste chaque page qui n'a pas de version dans l'une de vos langues, et nomme le fichier à ajouter. Une mauvaise balise de langue, ou une traduction qui ne pointe nulle part, arrête le build.
    
-   ### Des flux par langue
    
    Un flux de blog pour `/fr/blog/` contient les articles en français et indique qu'il est en français.
    
-   ### Des menus et des listes par langue
    
    Donnez à chaque langue son propre menu, et listez uniquement les pages d'une langue, comme les articles de blog en français, avec `collection()`.
    
    Voir [dans vos layouts](https://vagejs.com/docs/multi-language/#in-your-layouts)
    

## À qui s'adressent les sites multilingues avec vagejs

-   ### Aux entreprises dont les clients parlent plusieurs langues
    
    Vous servez des gens en deux ou trois langues et vous voulez un seul site à entretenir, pas trois.
    
-   ### Aux produits dont la documentation existe en plusieurs langues
    
    Vous traduisez votre documentation une page à la fois, et la vérification tient le compte de ce qui reste.
    
-   ### À toute personne dont l'assistant IA fait la traduction
    
    La vérification montre à votre assistant exactement ce qui manque, et vous relisez ce qu'il écrit.
    

## Ce que ça ne fait pas

Nous préférons que vous connaissiez les limites dès le départ.

-   vagejs ne traduit pas les pages pour vous. C'est vous, un traducteur ou votre assistant IA qui écrivez chaque version.
-   Il n'envoie pas les visiteurs vers une langue selon les réglages de leur navigateur. Un sélecteur de langue fonctionne de façon plus fiable sur un site statique.
-   `llms.txt` et le sitemap listent toutes les langues ensemble, pas un fichier par langue.

## Pour aller plus loin sur les sites multilingues avec vagejs

D'autres générateurs de sites statiques intègrent aussi le multilingue ; chez certains, il est plus ancien et couvre des configurations plus complexes. Voir [comment vagejs se compare](https://vagejs.com/compare/).

-   Étape par étape : [créer un site statique multilingue](https://vagejs.com/guides/multilingual-static-site/)
-   Toutes les options et vérifications : [les sites multilingues dans la documentation](https://vagejs.com/docs/multi-language/)
-   Les autres fonctionnalités : [toutes les fonctionnalités de vagejs](https://vagejs.com/fr/features/)

## Questions sur les sites multilingues

### Dois-je traduire toutes les pages ?

Non. Une page sans traduction existe simplement dans une seule langue. Si vous ne traduisez que certaines pages, listez-les sous `i18n.pages` dans `vage.config.ts` (vagejs 0.15.1 et plus récent), et `vage check` ne demande des traductions que pour ces pages-là.

### Une traduction manquante empêche-t-elle mon site de se construire ?

Non. Une traduction manquante est un avertissement, donc le site se construit pendant que vous traduisez. Lancez `vage check --strict` si vous voulez que les avertissements fassent échouer la vérification aussi. Les vraies erreurs, comme une mauvaise balise de langue ou un `translationOf` qui pointe vers une page qui n'existe pas, sont des erreurs.

### Quels codes de langue puis-je utiliser ?

Les codes de langue standard, comme `fr`, `de` ou `pt-BR`. Votre langue principale va dans `lang`, et les autres dans `i18n.locales`. Ne listez pas votre langue principale deux fois.

### Puis-je ajouter des langues à un site existant ?

Oui. Vos pages dans la langue principale gardent leurs adresses, donc rien de ce que vous avez publié ne bouge. Ajoutez les nouvelles langues dans `vage.config.ts` et placez chaque traduction dans le dossier de sa langue.