Configuration

Utilisation

npx gtx-cli setup

La commande gtx-cli setup configure automatiquement votre projet pour la traduction avec gt-next ou gt-react. Elle le fait en analysant l'arborescence des fichiers de votre projet et en utilisant babel pour envelopper le contenu statique avec le composant <T>. Tout contenu dynamique sera automatiquement enveloppé avec des composants <Var>.

Cette commande doit être exécutée une seule fois, lorsque vous internationalisez votre projet pour la première fois. Pour les modifications ultérieures, vous devriez utiliser la commande scan pour mettre à jour votre projet.

Consultez la commande scan pour plus de détails.

src/app/Home.js

import { T, Var } from 'gt-next';  
 
export default function Home({ user }) {
  return (
    <div>
      <T id="app.home.0">
        Hello, World! My name is <Var>{ user.name }</Var>
      </T>
    </div>
  );
}

Si votre projet utilise le App Router de Next.js, la commande setup ajoutera un composant <GTProvider> dans le fichier layout.jsx approprié.

Paramètres

Paramètre	Description	Type	Optionnel	Par défaut
`--src <path>`	Le répertoire source à analyser	`string`	`true`	`./src && ./app && ./pages && ./components`
`--config <path>`	Le chemin vers le fichier de configuration GT	`string`	`true`	`"gt.config.json"`

Comportement

Fichier de configuration

Lors de la première exécution de l'outil CLI, il tentera de créer un fichier gt.config.json à la racine de votre projet. Ce fichier contient des métadonnées sur votre projet qui sont utilisées pour traduire votre contenu.

En savoir plus sur le fichier gt.config.json ici.

La prop `id`

La commande setup offre la possibilité de générer automatiquement des identifiants uniques pour vos composants <T>. C'est utile pour les projets qui utilisent beaucoup de composants <T> et qui veulent éviter d'avoir à attribuer manuellement un identifiant unique à chacun.

Cet id est utile pour référencer des traductions spécifiques dans l'éditeur de traduction et dans la console.

Comportement d'injection de `<T>`

Cas de base

Le CLI enveloppera les éléments JSX au niveau le plus élevé possible. Cela signifie qu'il enveloppera l'ensemble du composant dans un composant <T> s'il n'est pas déjà enveloppé.

<div>Hello, World!</div> -> <T id="SOME_ID"><div>Hello, World!</div></T>

Consultez la référence pour plus de détails sur la façon dont le composant <T> est enveloppé.

Comportement de `<GTProvider>`

Pour le App Router de Next.js, la commande setup enveloppera automatiquement le composant <T> dans un composant <GTProvider> dans le fichier layout.jsx approprié.

De plus, elle configurera le plugin Next.js withGTConfig dans le fichier next.config.js pour vous.

Formatage automatique

La commande setup formatera automatiquement les modifications qu'elle apporte à votre base de code avec Prettier, Biome ou ESLint selon la configuration de votre projet.