SVG traduit colocalisé (système de documentation)

Utilisez pour les sites de systèmes de documentation où les illustrations SVG traduites doivent apparaître aux côtés de la documentation traduite dans le répertoire de contenu de chaque localisation — au même emplacement que les captures d'écran colocatées. Le preset Docusaurus est l'exemple principal.

Configuration

"features": {
  "translateSVG": true
},
"svg": {
  "sourcePath": [
    "documentation/static/assets/diagram.svg"
  ],
  "outputDir": "documentation/i18n",
  "style": "nested",
  "pathTemplate": "{outputDir}/{locale}/docusaurus-plugin-content-docs/current/assets/{basename}",
  "forceLowercase": true
}

translate-svg écrit un SVG par localisation dans le même répertoire current/assets/ que les captures d'écran colocatées utilisent pour les PNG :

documentation/i18n/de/docusaurus-plugin-content-docs/current/assets/diagram.svg
documentation/i18n/fr/docusaurus-plugin-content-docs/current/assets/diagram.svg

Source Markdown

Tous les documents dans toutes les langues utilisent le même chemin relatif :

![Diagram](../assets/diagram.svg)

Pour la langue anglaise, le lien symbolique docs/assets → ../static/assets résout cela. Pour les langues traduites, il pointe directement vers current/assets/.

Aucune règle regexAdjustments n'est nécessaire car les documents sources en anglais et les documents traduits en sortie utilisent des chemins identiques.

Emplacement de la source SVG

Recommandé : stocker les SVG sources dans documentation/static/assets/, aux côtés des PNG en-GB. Cela regroupe tous les éléments multimédias de la documentation au même endroit, et le même lien symbolique docs/assets couvre les deux types. Les entrées svg.sourcePath pointent ensuite vers documentation/static/assets/name.svg.

Espaces réservés pathTemplate

Espace réservé	Valeur
{outputDir}	Chemin absolu résolu de svg.outputDir
{locale}	Code de la langue cible
{LOCALE}	Code de langue en majuscules
{relPath}	Chemin relatif depuis la racine sourcePath vers le SVG source
{stem}	Nom de fichier sans extension
{basename}	Nom de fichier avec extension
{extension}	Extension incluant le point
{relativeToSourceRoot}	Chemin relatif depuis la racine sourcePath la plus proche

Référence complète dans le tableau de configuration svg.

Exemple d'implémentation

duplistatus — bloc svg imbriqué avec pathTemplate dans ai-i18n-tools.config.json ; SVG source dans documentation/static/assets/ (par exemple duplistatus_toolbar.svg) ; translate-svg écrit des fichiers par langue dans documentation/i18n/<locale>/…/current/assets/ à côté des PNG colocalisés ; la documentation les intègre via des chemins ../assets/ (par exemple overview.md) sans qu'un pont regexAdjustments ne soit nécessaire.

---