Configuration avancée

Lingo.dev Compiler offre de nombreuses options de configuration pour personnaliser le comportement de traduction et optimiser votre flux de travail de localisation.

Paramètres de configuration

Lors de l'implémentation du compilateur dans votre projet, vous pouvez transmettre un objet de paramètres avec les options suivantes :

// Configuration par défaut
const compilerConfig = {
  sourceRoot: "src",
  lingoDir: "lingo",
  sourceLocale: "en",
  targetLocales: ["es"],
  rsc: false,
  debug: false,
  models: {
    // Configuration de modèle personnalisée
    "*:fr": "mistral-saba-24b",
    "en:es": "meta-llama/llama-4-maverick-17b-128e-instruct",
    "*:*": "mistral-saba-24b",
  },
  prompt:
    "You are AI translator. You translate from {SOURCE_LOCALE} to {TARGET_LOCALE}.",
};

// Next.js
lingoCompiler.next(compilerConfig)(nextConfig);

// Vite/React Router
lingoCompiler.vite(compilerConfig)(viteConfig);

Options de configuration

  • sourceRoot - Chemin vers votre répertoire source où le répertoire lingo/ sera stocké
  • lingoDir - Nom du répertoire contenant les fichiers de traduction (par défaut : "lingo")
  • sourceLocale - La langue source de votre application (par défaut : "en")
  • targetLocales - Tableau des langues cibles pour la traduction
  • rsc - Activer la prise en charge des React Server Components (par défaut : false)
  • debug - Activer la journalisation de débogage pour le dépannage (par défaut : false)
  • models - Configuration personnalisée de modèle d'IA pour des paires de langues spécifiques (optionnel)
  • prompt - Invite de traduction personnalisée avec des espaces réservés (optionnel)

Modèles Groq suggérés

Pour de meilleurs résultats, nous avons testé et validé la qualité des modèles GROQ suivants pour des locales spécifiques :

mistral-saba-24b

  • ar - Arabe
  • de - Allemand
  • fr - Français
  • pt-BR - Portugais (Brésil)

meta-llama/llama-4-maverick-17b-128e-instruct

  • es - Espagnol
  • ja - Japonais
  • ko - Coréen
  • ru - Russe
  • zh - Chinois

Contrôle du traitement des fichiers

Ignorer les traductions

Ajoutez l'attribut data-lingo-skip aux éléments que vous ne souhaitez pas traduire :

<div data-lingo-skip>Ce contenu ne sera pas traduit</div>

Remplacements de traduction

Remplacez les traductions pour des locales spécifiques en utilisant les attributs data-lingo-override- :

<button data-lingo-override-es="¡Hola!" data-lingo-override-fr="Bonjour!">
  Hello
</button>

Configuration de modèle personnalisée

Vous pouvez personnaliser les modèles d'IA et les prompts directement dans votre configuration de compilateur :

const compilerConfig = {
  sourceLocale: "en",
  targetLocales: ["es", "fr", "de"],
  models: {
    "*:fr": "mistral-saba-24b",
    "en:es": "meta-llama/llama-4-maverick-17b-128e-instruct",
    "es:fr": "meta-llama/llama-4-maverick-17b-128e-instruct",
    "*:*": "mistral-saba-24b",
  },
  prompt:
    "You are a professional translator specializing in technical documentation. Translate from {SOURCE_LOCALE} to {TARGET_LOCALE} while maintaining technical accuracy.",
};

Configuration du modèle

  • Définissez les paires de locales comme source-locale:target-locale
  • Utilisez * comme joker pour n'importe quelle locale
  • Utilisez *:* comme solution de repli pour toutes les traductions
  • Consultez les modèles GROQ pour les options disponibles

Prompts personnalisés

Vous pouvez définir des prompts de traduction personnalisés avec des variables :

  • {SOURCE_LOCALE} - Code de la langue source
  • {TARGET_LOCALE} - Code de la langue cible

Pour créer des glossaires personnalisés, incluez la terminologie dans votre prompt. Consultez le prompt compilateur par défaut pour les meilleures pratiques.

Normalisation de build

Exécutez toujours un build de production en local avant de committer des modifications :

npm run build

Cela garantit que les fichiers meta.json et dictionary.js dans le répertoire lingo/ contiennent uniquement les chaînes présentes dans votre application et sont correctement formatés.

Configuration du hook pre-commit

Configurez la normalisation automatique en utilisant husky :


# Installer husky

npm install --save-dev husky

# Ajouter un hook pre-commit

npx husky add .husky/pre-commit "npm run build"

Configuration spécifique à l'environnement

Développement

const isDev = process.env.NODE_ENV === "development";

const compilerConfig = {
  debug: isDev,
  targetLocales: isDev ? ["es"] : ["es", "fr", "de", "ja"],
};

Intégration CI/CD

Pour les builds automatisés, assurez-vous que votre environnement CI a accès à la clé API GROQ :


# GitHub Actions

GROQ_API_KEY: ${{ secrets.GROQ_API_KEY }}

# Vercel

GROQ_API_KEY=gsk_...

# Netlify

GROQ_API_KEY=gsk_...

Optimisation des performances

Builds incrémentaux

Le compilateur automatiquement :

  • Suit les modifications de contenu via l'empreinte des fichiers
  • Traduit uniquement le contenu nouveau ou modifié
  • Réutilise les traductions existantes pour le contenu inchangé

Optimisation des bundles

  • Bundles par locale - Chargez uniquement les traductions pour la locale active
  • Tree shaking - Supprimez les traductions inutilisées des builds de production
  • Code splitting - Chargez les traductions à la demande pour les applications basées sur les routes

Dépannage

Mode de débogage

Activez la journalisation de débogage pour résoudre les problèmes :

const compilerConfig = {
  debug: true,
  // ... autres options
};

Problèmes courants

Traductions manquantes : Assurez-vous d'avoir exécuté npm run build localement et d'avoir commité le répertoire lingo/. Si vous utilisez NextJS, vous devrez peut-être supprimer le répertoire .next/ pour garantir que tous les fichiers sont reconstruits.

Erreurs de build : Vérifiez que votre GROQ_API_KEY est correctement définie dans vos variables d'environnement.

Problèmes de performance : Activez le mode de débogage pour identifier les goulots d'étranglement dans le processus de compilation.

Prochaines étapes