# General Translation Changelog: gt-react 10.13.0: t sous forme de littéral de gabarit étiqueté
URL: https://generaltranslation.com/fr/blog/gt-react_v10_13_0.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 
Authors: Ernest McCarter
Published: 2026-03-18

## Vue d’ensemble

Dans le cadre de nos [expérimentations continues pour nous éloigner du contexte React](/devlog/gt-react_v10_12_0), `gt-react` prend désormais en charge l’utilisation de [`t`](/docs/react/reference/functions/t-function) comme littéral de gabarit étiqueté :

```jsx
import { t } from "gt-react/browser";

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

Il s’agit d’une syntaxe alternative à l’appel de fonction [`t()`](/docs/react/reference/functions/t-function) existant. Au lieu d’utiliser des espaces réservés au format ICU et de passer un objet d’options, vous écrivez un littéral de gabarit JavaScript standard, et l’interpolation des variables est gérée automatiquement.

## Avant et après

```jsx
// Avant — espaces réservés ICU + objet d'options
t("Hello, {name}! You have {count} items.", { name, count })

// Après — littéral de gabarit étiqueté
t`Hello, ${name}! You have ${count} items.`
```

La forme de littéral de gabarit étiqueté évite d’avoir à nommer les espaces réservés ou à dupliquer les références de variables. Vous écrivez votre chaîne comme vous écririez n’importe quel template literal JavaScript.


## Aucun contexte React nécessaire

Comme la fonction [`t()`](/docs/react/reference/functions/t-function) introduite dans [gt-react@10.12.0](/devlog/gt-react_v10_12_0), la forme de littéral de gabarit étiqueté ne dépend pas du contexte React. Elle fonctionne partout dans le code exécuté dans le navigateur :

* **Gestionnaires d’événements** : ``onClick={() => alert(t`Saved!`)}``
* **Fonctions utilitaires** : ``function formatError(code) { return t`Error: ${code}` }``
* **Constantes et configuration** : ``const LABELS = { save: t`Save`, cancel: t`Cancel` }``
* **Même complètement en dehors des composants React**

## Enregistrement global

Si vous ne souhaitez pas importer [`t`](/docs/react/reference/functions/t-function) dans chaque fichier, vous pouvez l’enregistrer de façon globale :

```js
// Dans le point d'entrée de votre application (ex. : layout.tsx)
import "gt-react/macros";
```

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

## Exemple

```jsx
import { t } from "gt-react/browser";

export function Greeting({ name }) {
  return <p>{t`Hello, ${name}!`}</p>;
}

export function SaveButton() {
  return (
    <button onClick={() => alert(t`Changes saved!`)}>
      {t`Save`}
    </button>
  );
}
```

Ou avec un enregistrement global :

```jsx
// Aucun import nécessaire — t est sur globalThis
const LABELS = {
  save: t`Save`,
  cancel: t`Cancel`,
  delete: t`Delete`,
};
```


## Liens

* [Devlog précédent : abandon du contexte React (gt-react@10.12.0)](/devlog/gt-react_v10_12_0)
* [Référence de l’API `t()`](/docs/react/reference/functions/t-function)
* [PR #1118](https://github.com/generaltranslation/gt/pull/1118)

## Sitemap

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