# General Translation React SDKs (gt-react, gt-next): Plugin
URL: https://generaltranslation.com/it/docs/react/react-native/plugin.mdx
---

title: Plugin
description: Riferimento per il plugin Babel gt-react-native di General Translation, che aggiunge i polyfill `Intl` necessari a React Native. Riferimento API per il plugin gt-react-native.

---

`gt-react-native/plugin` è un plugin Babel che aggiunge i polyfill `Intl` di `@formatjs` necessari a `gt-react-native`. Il runtime JavaScript di React Native non include tutte le API `Intl` usate per formattare numeri, date, plurali e nomi delle impostazioni regionali, quindi il plugin le aggiunge all'entry point della tua app.

Configuralo in `babel.config.js`. Fa parte della [setup](/docs/react/react-native/setup) standard di React Native; questa pagina ne descrive il funzionamento e le opzioni.

## Panoramica [#overview]

Aggiungi il plugin alla configurazione di Babel, impostando `entryPointFilePath` sul file di ingresso della tua app e passando le impostazioni regionali per cui applicare il polyfill. Il plugin è una **named export**, quindi destrutturalo (`const { plugin } = require('gt-react-native/plugin')`) invece di usare direttamente l'oggetto del modulo.

```js title="babel.config.js"
const { plugin: gtPlugin } = require('gt-react-native/plugin');
const gtConfig = require('./gt.config.json');

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      [
        gtPlugin,
        {
          locales: [gtConfig.defaultLocale, ...gtConfig.locales],
          entryPointFilePath: require.resolve('expo-router/entry'),
        },
      ],
    ],
  };
};
```

## Come funziona [#how-it-works]

In fase di build, quando Babel trasforma il file in `entryPointFilePath`, il plugin antepone le istruzioni `import` per:

* I polyfill di base di `@formatjs` — `getcanonicallocales`, `locale`, `displaynames`, `listformat`, `pluralrules`, `numberformat`, `relativetimeformat` e `datetimeformat` (con tutti i fusi orari) — ad eccezione di quelli elencati in `excludePolyfills`.
* I dati di impostazione regionale per ogni impostazione regionale risolta, nei polyfill `displaynames`, `listformat`, `pluralrules`, `numberformat`, `relativetimeformat` e `datetimeformat`.

Modifica solo il file di ingresso e salta qualsiasi import di polyfill già presente. Le impostazioni regionali vengono risolte da `locales` oppure da `config`/`configFilePath`, se passi invece questi.

*Nota: se il plugin non funziona nella tua configurazione, importa manualmente i polyfill all'inizio del file di ingresso. Consulta la [documentazione sui polyfill di FormatJS](https://formatjs.github.io/docs/polyfills).*

## Opzioni [#options]

| Opzione                                        | Descrizione                                                                | Tipo       | Facoltativo | Predefinito   |
| ---------------------------------------------- | -------------------------------------------------------------------------- | ---------- | ----------- | ------------- |
| [`locales`](#locales)                          | Codici locale per cui caricare i dati delle impostazioni regionali.        | `string[]` | Sì          | Da `config`   |
| [`entryPointFilePath`](#entry-point-file-path) | Percorso del file entry point a cui vengono aggiunti i polyfill.           | `string`   | Sì          | `src/App.tsx` |
| [`config`](#config)                            | Oggetto di configurazione di General Translation da cui leggere `locales`. | `object`   | Sì          | —             |
| [`configFilePath`](#config-file-path)          | Percorso di un file `gt.config.json` da cui leggere `locales`.             | `string`   | Sì          | —             |
| [`excludePolyfills`](#exclude-polyfills)       | Polyfill di base da escludere.                                             | `string[]` | Sì          | `[]`          |

### `locales` [#locales]

**Tipo** `string[]` · **Facoltativo**

I codici delle impostazioni regionali per cui caricare i dati di `@formatjs` relativi alle impostazioni regionali. Includi la tua impostazione regionale predefinita e ogni impostazione regionale di destinazione, ad esempio `[gtConfig.defaultLocale, ...gtConfig.locales]`. Se omesso, `locales` viene ricavato da `config` o `configFilePath`.

### `entryPointFilePath` [#entry-point-file-path]

**Tipo** `string` · **Facoltativo** · **Predefinito** `src/App.tsx`

Percorso assoluto del file in cui vengono inseriti gli import del polyfill. Deve essere il vero entry point della tua app. I valori più comuni sono `require.resolve('expo-router/entry')` per Expo e `path.resolve(__dirname, 'index.js')` per React Native CLI in modalità bare.

### `config` [#config]

**Tipo** `{ defaultLocale: string; locales: string[] } & Record<string, unknown>` · **Facoltativo**

Un oggetto di configurazione di General Translation da cui ricavare le impostazioni regionali, come alternativa al passaggio diretto di `locales`.

### `configFilePath` [#config-file-path]

**Tipo** `stringa` · **Facoltativo**

Percorso di un file `gt.config.json` da cui ricavare le impostazioni regionali, in alternativa a passare `locales` o `config`.

### `excludePolyfills` [#exclude-polyfills]

**Tipo** `string[]` · **Facoltativo** · **Predefinito** `[]`

Percorsi di importazione dei polyfill di base da ignorare, se ne fornisci uno tu. I valori devono corrispondere ai percorsi di importazione dei polyfill di base del plugin, ad esempio `@formatjs/intl-datetimeformat/add-all-tz`.

## Esempio [#example]

React Native CLI puro, con `index.js` come punto di ingresso:

```js title="babel.config.js"
const path = require('path');
const { plugin: gtPlugin } = require('gt-react-native/plugin');
const gtConfig = require('./gt.config.json');

module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: [
    [
      gtPlugin,
      {
        locales: [gtConfig.defaultLocale, ...gtConfig.locales],
        entryPointFilePath: path.resolve(__dirname, 'index.js'),
      },
    ],
  ],
};
```