# vue: createGT
URL: https://generaltranslation.com/it/docs/vue/reference/functions/create-gt.mdx
---

title: createGT
description: Crea un plugin Vue isolato per le traduzioni, con stato reattivo dell'impostazione regionale e cache del catalogo. Riferimento API di createGT.

---

Ogni chiamata crea uno stato dell'impostazione regionale indipendente, caricamenti in corso e cataloghi memorizzati nella cache. Usalo per le normali applicazioni client e crea un'istanza per ogni richiesta per il rendering lato server.

## Panoramica [#overview]

```ts
function createGT(options?: CreateGTOptions): GTPlugin;
```

[`createGT()`](#overview) restituisce immediatamente. Installa il plugin con `app.use()` oppure precarica un'impostazione regionale tramite [`GTPlugin`](/docs/vue/reference/types/gt-plugin) restituito prima del rendering.

```ts
import { createApp } from 'vue';
import { createGT } from 'gt-vue';
import App from './App.vue';

const gt = createGT({
  defaultLocale: 'en',
  loadTranslations: async (locale) =>
    (await import(`./_gt/${locale}.json`)).default,
});

createApp(App).use(gt).mount('#app');
```

## Parametri [#parameters]

| Parametro | Descrizione                                                                                    | Tipo                                                             | Facoltativo | Predefinito |
| --------- | ---------------------------------------------------------------------------------------------- | ---------------------------------------------------------------- | ----------- | ----------- |
| `options` | Configurazione iniziale dell'impostazione regionale, dei cookie e del loader del catalogo. | [`CreateGTOptions`](/docs/vue/reference/types/create-gt-options) | Sì          | `{}`        |

L'oggetto `options` accetta i seguenti campi:

| Opzione            | Descrizione                                                                         | Tipo                                                              | Facoltativo | Predefinito                    |
| ------------------ | ----------------------------------------------------------------------------------- | ----------------------------------------------------------------- | ----------- | ------------------------------ |
| `defaultLocale`    | Impostazione regionale sorgente e di fallback.                                      | `string`                                                          | Sì          | `en`                           |
| `loadTranslations` | Loader asincrono del catalogo di destinazione.                                      | [`LoadTranslations`](/docs/vue/reference/types/load-translations) | Sì          | Catalogo vuoto                 |
| `locale`           | Impostazione regionale iniziale esplicita. Ha la precedenza sul cookie del browser. | `string`                                                          | Sì          | Cookie, quindi `defaultLocale` |
| `localeCookieName` | Cookie del browser usato per mantenere l'impostazione regionale.                | `string`                                                          | Sì          | `generaltranslation.locale`    |

L'impostazione regionale predefinita renderizza sempre il contenuto sorgente, quindi il relativo loader non viene mai chiamato. A differenza di [`initializeGTSPA()`](/docs/vue/reference/functions/initialize-gt-spa), [`createGT()`](#overview) non accetta una allowlist `locales` né `customMapping`; il chiamante e il loader determinano quali codici locale possono essere usati.

## Valore restituito [#returns]

**Tipo** [`GTPlugin`](/docs/vue/reference/types/gt-plugin)

Il plugin restituito espone `install()`, `getLocale()`, `loadTranslations()` e `setLocale()`. Installa la stessa istanza di cui usi i metodi imperativi.

Questo plugin non è connesso allo stato globale del browser utilizzato da [`t()`](/docs/vue/reference/functions/t). Un'applicazione client che necessita di traduzioni a livello di modulo deve invece installare esattamente il plugin restituito da [`initializeGTSPA()`](/docs/vue/reference/functions/initialize-gt-spa).

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

* **Impostazione regionale iniziale:** un valore `locale` esplicito prevale sul cookie del browser, che a sua volta prevale su `defaultLocale`. Sul server non è presente alcun cookie del browser. Nel browser, un'impostazione regionale esplicita viene scritta anche nel cookie per garantire un'idratazione coerente.
* **Caricamento iniziale:** `app.use(gt)` inizia a caricare l'impostazione regionale di destinazione attiva senza bloccare il montaggio. Il contenuto sorgente viene renderizzato finché non arriva il catalogo; quindi, i consumer che hanno eseguito lookup vengono renderizzati nuovamente.
* **Memorizzazione nella cache:** i cataloghi caricati correttamente vengono memorizzati nella cache per tutta la durata del plugin. Le richieste simultanee per la stessa impostazione regionale condividono un'unica promise. L'impostazione regionale predefinita è rappresentata dal testo sorgente ed è già memorizzata nella cache come catalogo vuoto.
* **Modifiche dell'impostazione regionale:** `setLocale(locale)` carica un catalogo non presente nella cache prima di aggiornare il cookie e i consumer reattivi. Quando le richieste relative all'impostazione regionale si sovrappongono, solo l'ultima modifica l'impostazione regionale attiva; i cataloghi caricati correttamente in precedenza restano nella cache.
* **Modifiche esterne del cookie:** `getLocale()` legge il cookie corrente del browser. I browser non emettono un evento reattivo per le modifiche dei cookie, pertanto modificare direttamente `document.cookie` non pianifica un rendering; chiama il setter del plugin o [`useSetLocale()`](/docs/vue/reference/composables/use-set-locale).

Se un loader restituisce un errore, il plugin registra una diagnostica `gt-vue`, rilancia l'errore e non memorizza l'errore nella cache. Una chiamata a `setLocale()` che restituisce un errore mantiene l'impostazione regionale e il cookie precedenti. Il caricamento in background avviato da `install()` registra l'errore, ma ne intercetta il rifiuto affinché l'app possa continuare a renderizzare il contenuto sorgente.

## Rendering lato server [#server-rendering]

Crea una nuova istanza del plugin per ogni richiesta e passa esplicitamente l'impostazione regionale della richiesta. Attendi `loadTranslations(locale)` o `setLocale(locale)` prima di renderizzare:

```ts title="src/gt-server.ts"
import { createGT } from 'gt-vue';
import loadTranslations from './loadTranslations';

export async function createRequestGT(locale: string) {
  const gt = createGT({
    defaultLocale: 'en',
    locale,
    loadTranslations,
  });

  await gt.loadTranslations(locale);
  return gt;
}
```

Non condividere questo plugin tra le richieste. La cache dell'impostazione regionale e del catalogo è associata a una singola istanza dell'applicazione. Prima dell'idratazione, crea e precarica un plugin client con la stessa impostazione regionale esplicita; l'idratazione con un catalogo non caricato può renderizzare il contenuto sorgente e causare una mancata corrispondenza.

## Esempio [#example]

Usa i metodi restituiti dal plugin al di fuori di un componente quando l'applicazione host gestisce le modifiche dell'impostazione regionale:

```ts
const gt = createGT({ defaultLocale: 'en', loadTranslations });

await gt.loadTranslations('fr'); // precarica senza cambiare l'impostazione regionale
await gt.setLocale('fr'); // usa il catalogo in cache e rirenderizza i consumer

console.log(gt.getLocale()); // "fr"
```