# General Translation React SDKs (gt-react, gt-next, gt-react-native): t
URL: https://generaltranslation.com/fr/docs/react/reference/functions/t-function.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: Traduire des chaînes de façon synchrone au niveau du module. Référence de l’API pour t.

La fonction `t` est une fonction synchrone de traduction de chaînes au niveau du module pour les applications `gt-react` côté client. Contrairement à [`useGT`](/docs/react/reference/hooks/use-gt) (qui nécessite le contexte React) ou à [`msg`](/docs/react/reference/functions/msg) (qui encode les chaînes pour une résolution ultérieure), `t` renvoie directement la chaîne traduite et peut être appelée n’importe où dans le code du navigateur, y compris en dehors des composants React.

*Disponible dans `gt-react` et `gt-tanstack-start`.*

*Remarque : n’est pas exporté par `gt-next` ni par `gt-react-native`. Dans `gt-next`, utilisez [`useGT`](/docs/react/reference/hooks/use-gt) dans les composants synchrones ou [`getGT`](/docs/react/nextjs/reference/functions/get-gt) dans les composants async App Router.*

## Vue d’ensemble [#overview]

Importez `t` depuis `gt-react` et appelez-le en lui passant une chaîne de caractères.

*Les exemples importent depuis `gt-react` ; importez depuis `gt-tanstack-start` pour TanStack Start.*

```tsx
import { t } from 'gt-react';

const greeting = t('Hello, world!');
```

Il peut également être utilisé comme littéral de gabarit tagué :

```tsx
import { t } from 'gt-react';

const greeting = t`Hello, ${name}!`;
```

*Remarque : `t` lit les traductions dans le cache client alimenté par [`initializeGTSPA`](/docs/react/reference/config#initialize-spa). Assurez-vous que l’initialisation a bien été exécutée avant tout module qui appelle `t` au niveau du module. Appeler `t` au niveau du module dans une application rendue côté serveur est interdit : cela lève une exception en développement et, en production, journalise une erreur puis se replie sur la valeur du paramètre régional par défaut.*

## Fonctionnement [#how-it-works]

* **Traduction synchrone au niveau du module.** Une fois les traductions chargées pour le paramètre régional actif, `t` les lit de manière synchrone, sans surcoût. Comme il n’utilise pas le contexte React, il fonctionne au niveau du module (constantes, tables de routes) aussi bien qu’à l’intérieur des composants.
* **Résolu au chargement.** Les traductions sont résolues lors de l’évaluation des modules, donc **changer de paramètre régional nécessite un rechargement complet de la page** — le navigateur doit réexécuter les modules pour prendre en compte le nouveau paramètre régional. Cette approche fonctionne uniquement dans les applications côté client.
* **Les variables ne sont pas traduites.** Les valeurs interpolées sont insérées dans la chaîne traduite, mais ne sont jamais traduites.
* **Comportement côté serveur.** Appeler `t` au niveau du module est interdit lorsque la stratégie de rendu est `server-render` — c’est-à-dire avant l’initialisation du magasin de conditions au moment de la requête. En développement, cela génère une erreur ; en production, cela consigne une erreur et utilise la valeur `defaultLocale` comme repli. Pour la traduction côté serveur, utilisez des hooks basés sur le contexte, comme [`useGT`](/docs/react/reference/hooks/use-gt).

## Littéral de gabarit tagué [#tagged-template]

`t` peut être utilisé sous forme de littéral de gabarit tagué pour une syntaxe plus naturelle. Les exemples suivants sont équivalents :

```tsx
import { t } from 'gt-react';

t('Hello, {name}!', { name: 'Alice' });
t`Hello, ${name}!`;
```

La forme taguée interpole directement les variables depuis le template, vous n’avez donc pas besoin de placeholders de style ICU ni d’un objet d’options.

### Enregistrement global [#macros]

Au lieu d’importer `t` dans chaque fichier, enregistrez-le globalement en important une seule fois le point d’entrée des macros dans le point d’entrée de votre application :

```tsx
import 'gt-react/macros';
```

Cela définit `globalThis.t`, ce qui rend le littéral de gabarit tagué disponible partout sans import explicite :

```tsx
// Aucun import nécessaire
const labels = {
  save: t`Save`,
  cancel: t`Cancel`,
};
```

## Paramètres [#parameters]

| Paramètre             | Description                                         | Type                   | Facultatif | Par défaut |
| --------------------- | --------------------------------------------------- | ---------------------- | ---------- | ---------- |
| [`message`](#message) | La chaîne à traduire.                               | `string`               | Non        | —          |
| [`options`](#options) | Variables d’interpolation et options de traduction. | `GTTranslationOptions` | Oui        | —          |

### `message` [#message]

**Type** `string` · **Obligatoire**

La chaîne à traduire. Lorsqu’elle est utilisée comme littéral de gabarit tagué, il s’agit alors de la chaîne du template.

### `options` [#options]

**Type** `GTTranslationOptions` · **Facultatif**

Variables d’interpolation et options, comme `$context` et `$id`. Voir [`InlineTranslationOptions`](/docs/react/reference/types/inline-translation-options).

## Renvoie [#returns]

**Type** `string`

La chaîne traduite pour le paramètre régional actif, ou la chaîne source si aucune traduction n’est disponible.

## Exemples [#examples]

```tsx title="constants.ts"
import { t } from 'gt-react';

export const ERROR_MESSAGES = {
  notFound: t('Page not found'),
  unauthorized: t('You do not have permission to view this page'),
  serverError: t('Something went wrong. Please try again later.'),
};
```

```tsx title="routes.ts"
import { t } from 'gt-react';

export const routes = [
  { path: '/', label: t('Home') },
  { path: '/dashboard', label: t('Dashboard') },
  { path: '/settings', label: t('Settings') },
];
```

```tsx
import { t } from 'gt-react';

const message = t('Hello, {name}!', { name: 'Alice' });
// Les valeurs des variables sont insérées, non traduites.
```

## Remarques [#notes]

* `t` est synchrone et peut être appelé au niveau du module ; il n’utilise pas le contexte React.
* Changer de paramètre régional nécessite un rechargement complet de la page.
* Pour traduire des chaînes de caractères dans les composants, utilisez [`useGT`](/docs/react/reference/hooks/use-gt) ; pour encoder des chaînes en vue d’une résolution ultérieure, utilisez [`msg`](/docs/react/reference/functions/msg).

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.