# Vue: initializeGTSPA URL: https://generaltranslation.com/it/docs/vue/reference/functions/initialize-gt-spa.mdx Docs index: https://generaltranslation.com/llms.txt Description: Inizializza e precarica il runtime Vue SPA solo lato browser per le traduzioni a livello di modulo. Riferimento API per initializeGTSPA. Questo inizializzatore gestisce un unico runtime per l'intera pagina e rende il catalogo caricato disponibile per chiamate sincrone a [`t()`](/docs/vue/reference/functions/t). Integra il composable [`useGT()`](/docs/vue/reference/composables/use-gt) nei componenti; non lo sostituisce né supporta il rendering lato server. ## Panoramica [#overview] ```ts function initializeGTSPA( options?: InitializeGTSPAOptions ): Promise; ``` Attendi l'inizializzazione prima di importare qualsiasi modulo che richiami [`t()`](/docs/vue/reference/functions/t), quindi installa esattamente il plugin restituito: ```ts title="src/index.ts" import { initializeGTSPA } from 'gt-vue'; import gtConfig from '../gt.config.json'; import loadTranslations from './loadTranslations'; async function bootstrap() { const gt = await initializeGTSPA({ ...gtConfig, loadTranslations }); const { mount } = await import('./main'); mount(gt); } void bootstrap().catch((error: unknown) => { console.error(error); }); ``` ## Parametri [#parameters] | Parametro | Descrizione | Tipo | Facoltativo | Predefinito | | --------- | ------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------- | ----------- | ----------- | | `options` | Configurazione del loader per impostazione regionale SPA, cookie, mapping, allowlist e catalogo. | [`InitializeGTSPAOptions`](/docs/vue/reference/types/initialize-gt-spa-options) | Sì | `{}` | | 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 usato per salvare la selezione dell'impostazione regionale. | `string` | Sì | `generaltranslation.locale` | | `locales` | Impostazioni regionali di destinazione accettate dalla configurazione, dai cookie e dai setter. | `readonly string[]` | Sì | Senza restrizioni | | `customMapping` | Oggetto che associa i valori `code` usati per il matching delle impostazioni regionali e la risoluzione dell'impostazione regionale del formatter. | [`CustomMapping`](/docs/platform/core/reference/types/custom-mapping) | Sì | Nessuno | `locales` contiene normalmente le impostazioni regionali di destinazione definite in `gt.config.json`; l'inizializzatore aggiunge `defaultLocale` all'insieme delle impostazioni regionali supportate. Per i dettagli sulla risoluzione, consulta [`InitializeGTSPAOptions`](/docs/vue/reference/types/initialize-gt-spa-options). ## Inizializzazione [#initialization] La prima chiamata avvia l'inizializzazione a livello di pagina e ne definisce le opzioni. Le chiamate simultanee condividono la stessa promise. Una volta completata con successo, ogni chiamata successiva restituisce lo stesso [`GTPlugin`](/docs/vue/reference/types/gt-plugin) e ignora le nuove opzioni. Prima di risolversi, l'inizializzazione esegue questi passaggi: 1. Determina l'impostazione regionale esplicita, il cookie salvato o l'impostazione regionale predefinita in base a `locales` e `customMapping`. 2. Crea un runtime la cui impostazione regionale attiva rimane fissata per l'intera durata della pagina. 3. Carica e memorizza nella cache il catalogo di destinazione attivo. L'impostazione regionale predefinita utilizza il contenuto sorgente e non usa il loader. 4. Pubblica il runtime nelle chiamate [`t()`](/docs/vue/reference/functions/t) a livello di modulo. Se il caricamento non riesce, l'inizializzazione registra la diagnostica del loader e restituisce un errore. Il tentativo non riuscito non diventa il singleton, quindi una chiamata successiva può riprovare. ## Modifiche dell'impostazione regionale [#locale-changes] Il plugin restituito utilizza una transizione di ricaricamento. Chiamando `plugin.setLocale(locale)` o [`useSetLocale()`](/docs/vue/reference/composables/use-set-locale), viene determinata l'impostazione regionale richiesta, questa viene scritta nel cookie configurato e il documento viene ricaricato. La pagina corrente rimane nell'impostazione regionale selezionata fino al ricaricamento. All'avvio successivo viene determinato il nuovo cookie e ne viene precaricato il catalogo prima dell'esecuzione dei moduli dell'applicazione, quindi ogni traduzione a livello di modulo viene valutata nuovamente. Il setter non carica il catalogo di destinazione nella pagina corrente prima di ricaricarla. Se viene fornito `locales`, la corrispondenza non distingue tra maiuscole e minuscole e supporta gli alias canonici. La grafia in `gt.config.json` viene mantenuta per i percorsi del loader. Le impostazioni regionali salvate o richieste non supportate vengono risolte in `defaultLocale`. Se `locales` viene omesso, i codici locale diversi da quello predefinito restano senza restrizioni. ## Valore restituito ed errori [#return-errors] **Restituisce** `Promise<`[`GTPlugin`](/docs/vue/reference/types/gt-plugin)`>` La promise si risolve solo quando l'impostazione regionale iniziale è pronta. Installa esattamente questo plugin; creando un'istanza separata di [`createGT()`](/docs/vue/reference/functions/create-gt), i componenti avrebbero un'impostazione regionale e una cache del catalogo diverse rispetto a [`t()`](/docs/vue/reference/functions/t). La promise restituita viene rifiutata in un ambiente con rendering lato server, poiché lo stato globale del browser e il ricaricamento del documento non sono sicuri nell'ambito di una richiesta. Per il rendering lato server, usa un unico plugin [`createGT({ locale })`](/docs/vue/reference/functions/create-gt#server-rendering) con ambito di richiesta e [`useGT()`](/docs/vue/reference/composables/use-gt) all'interno dei componenti. ## Esempio [#example] Mantieni il normale punto di ingresso di Vue all'interno di una funzione di montaggio: ```ts title="src/main.ts" import { createApp } from 'vue'; import type { GTPlugin } from 'gt-vue'; import App from './App.vue'; export function mount(gt: GTPlugin) { createApp(App).use(gt).mount('#app'); } ``` Qualsiasi modulo caricato tramite la successiva importazione dinamica può quindi eseguire traduzioni durante la valutazione: ```ts title="src/navigation.ts" import { t } from 'gt-vue'; export const navigation = [ { label: t('Documentation'), href: '/docs' }, { label: t('Settings'), href: '/settings' }, ]; ``` ## Sitemap See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.