# gt-react: General Translation React SDK: Compilateur
URL: https://generaltranslation.com/fr/docs/react/concepts/compiler.mdx
---
title: Compilateur
description: Comment la CLI `gt` traite vos fichiers source React
---

La CLI `gt` inclut un compilateur qui analyse vos fichiers source React au build. Il détecte les erreurs de traduction courantes et peut aussi automatiser l’ajout de composants de traduction autour du JSX.

## Fonctionnalités

### Détection du contenu dynamique

Détecte le contenu dynamique non encapsulé dans les composants de traduction :

```jsx
// ❌ Invalide - contenu dynamique non encapsulé
<T>Hello {userName}</T>

// ✅ Valide - contenu dynamique encapsulé dans un composant variable  
<T>Hello <Var>{userName}</Var></T>
```


### Validation des appels de fonction

Détecte les arguments non littéraux transmis aux fonctions de traduction :

```jsx
const gt = useGT();

// ❌ Invalide - littéraux de gabarit et concaténation
gt(`Hello ${name}`)
gt("Hello " + name)

// ✅ Valide - littéraux de chaînes de caractères avec substitution de variables
gt("Hello, {name}!", { name })
```


## Injection automatique de JSX

Avec l’injection automatique de JSX activée, le compilateur entoure automatiquement les textes JSX traduisibles de composants de traduction — vous n’avez donc pas besoin d’ajouter manuellement des composants `<T>` autour de chaque fragment de texte.

### Activer l’injection automatique de JSX

Ajoutez `enableAutoJsxInjection` à votre `gt.config.json` :

```json title="gt.config.json"
{
  "files": {
    "gt": {
      "output": "public/_gt/[locale].json",
      "parsingFlags": {
        "enableAutoJsxInjection": true
      }
    }
  }
}
```


### Avant et après

Sans injection automatique de JSX, vous devez encapsuler le texte manuellement :

```jsx
import { T } from 'gt-react';

function Welcome() {
  return (
    <T>
      <h1>Welcome to our app</h1>
    </T>
  );
}
```

Avec l’injection automatique de JSX activée, vous écrivez simplement du JSX et le compilateur s’occupe du reste :

```jsx
function Welcome() {
  return <h1>Welcome to our app</h1>;
}
```

Le compilateur détecte le texte traduisible et l’entoure automatiquement lorsque vous exécutez `npx gt translate`.


### Ce que le compilateur respecte

* **Les composants `<T>` définis par l&#39;utilisateur** sont laissés intacts — le compilateur n&#39;encapsulera pas votre code une deuxième fois
* **Les autres composants GT** comme `<Var>`, `<Branch>`, `<Plural>` et `<Derive>` sont également respectés
* **Les attributs textuels** (par ex. `placeholder`, `alt`) ne sont pas affectés — seuls les enfants JSX sont encapsulés
* **Le contenu non textuel** comme les nombres et les booléens est ignoré