.svg)
.svg)
.svg)
.svg)
.svg)
Quali sono le sfide comuni nell'aggiungere la localizzazione ai progetti React Native?
La localizzazione in React Native è più complessa rispetto alla localizzazione web o nativa, perché un'app React Native memorizza le sue stringhe in file JSON strutturati in JavaScript, ma viene distribuita come un'applicazione nativa per iOS o Android. Di conseguenza, si ripresentano quattro problemi: il formato a chiave plurale di react-i18next, che Smartling analizza solo tramite un'estensione ICU MessageFormat; i file di risorse JSON, che non ottengono un contesto visivo automatico; l'espansione delle stringhe su uno schermo in cui, come afferma la panoramica delle app mobili di Smartling, lo spazio è limitato; e le correzioni di traduzione che attendono la revisione dell'app store perché il JSON è già incluso nel pacchetto. Ciascuna di queste soluzioni prevede una correzione concreta a livello di file, formato, contesto o distribuzione, anziché una soluzione alternativa.
Ultimo aggiornamento: 21 settembre 2026
Perché la localizzazione in React Native è più difficile rispetto alla localizzazione web o nativa presa singolarmente?
React Native si basa su due modelli di localizzazione progettati separatamente, e la maggior parte delle difficoltà deriva dal punto di congiunzione tra di essi, piuttosto che da un singolo strumento.
- Il formato delle risorse è web, il modello di rilascio è nativo. Un progetto React Native memorizza le stringhe di località in JSON, lo stesso formato che usa un'app web React, ma queste stringhe vengono normalmente importate nel bundle JavaScript e inviate all'interno del binario. Una traduzione errata su un sito web richiede una nuova pubblicazione; in un'app React Native, invece, è necessario attendere la revisione da parte dell'App Store o di Google Play, un aspetto che Smartling Mobile Apps Overview cita esplicitamente come una delle ragioni per cui è difficile mantenere aggiornate le app localizzate.
- Il formato plurale di react-i18next non è ICU. react-i18next, il binding standard per l'internazionalizzazione nei codebase di React, eredita la convenzione del suffisso a chiave plurale di i18next. La documentazione di Smartling relativa al formato ICU MessageFormat afferma chiaramente che il formato plurale di i18next non è supportato e indica l'estensione ICU MessageFormat di i18next come soluzione per colmare questa lacuna: pertanto, la decisione sul plurale deve essere presa prima della scrittura delle chiavi, non dopo.
- I file JSON non contengono automaticamente alcun contesto visivo. La documentazione JSON di Smartling afferma che il contesto visivo non viene fornito automaticamente per i file JSON. I sostituti abituali — la libreria JavaScript di Smartling e l'estensione Google Chrome per la cattura del contesto — leggono un DOM, mentre un'app React Native visualizza le viste native, quindi un team React Native deve fornire il contesto tramite screenshot caricati o tramite l'API Context invece che uno strumento browser.
- Un caricamento JSON predefinito cattura troppe informazioni. Caricato senza direttive, il parser JSON di Smartling cattura ogni valore nel file come stringa traducibile e utilizza il percorso completo del nome come dati chiave e variante. In un vero bundle react-i18next che include valori di configurazione, ID e nomi di percorso insieme alla copia dell'interfaccia utente, a meno che
translate_pathsoexclude_pathnon ne limitino l'ambito. - Il test di lunghezza funziona diversamente rispetto al nativo. Le pseudo-località XA/XB di Android Studio e la pseudolocalizzazione di Xcode funzionano su file di risorse native, non su un bundle JSON. Per JSON, la pseudo-inflazione di Smartling è disponibile solo come argomento di upload API — non è esplicitamente supportata come direttiva inline — quindi il test di lunghezza deve essere collegato al passaggio di upload piuttosto che alla build dell'app.
I quattro livelli in cui viene decisa la configurazione della localizzazione di React Native
- Livello file — definisci ciò che viene effettivamente tradetto. Usa la
translate_pathsdirettiva per nominare i percorsi che contengono copia UI eexclude_pathper lasciare i sotto-percorsi che non dovrebbero mai raggiungere un traduttore. Impostandokeyper{*}preservare il comportamento predefinito di cattura dell'intero percorso della chiave come metadati varianti, che è ciò che mantiene una stringa tradotta abbinata alla chiave JSON corretta al ritorno. - Livello di formattazione: gestisci i plurali prima di scrivere le chiavi. Se il progetto utilizza react-intl o un'altra libreria FormatJS, imposta
string_formatsuicue Smartling analizzerà i plurali e selezionerà in modo nativo. Se si utilizza react-i18next, adottare l'estensione ICU MessageFormat di i18next in modo che la sintassi del plurale analizzata da Smartling corrisponda alla sintassi presente nel file. - Livello di contesto: sostituire il browser con degli screenshot. Poiché JSON non riceve automaticamente alcun contesto visivo e gli strumenti di acquisizione basati su browser non dispongono di un'interfaccia React Native da leggere, il contesto proviene da screenshot caricati e abbinati a stringhe tramite OCR, da video o dall'API Context per un progetto in corso.
- Livello di distribuzione — decidere se una correzione di stringhe necessita di essere rilasciata. Includere JSON nell'app collega ogni correzione a una presentazione di un app store. Recuperare contenuti localizzati a runtime — il caso d'uso per cui è stata creata l'API di Consegna della Traduzione di Smartling — disaccoppia una correzione della stringa dal ciclo di rilascio, a scapito di una dipendenza di rete e di una strategia di cache che il team deve possedere.
Localizzazione di React Native: limiti di configurazione verificati
| Punto di configurazione | Valore verificato | sorgente |
|---|---|---|
| Modelli segnaposto che il parser JSON di Smartling riconosce senza una direttiva personalizzata | 7 — {x}, {{x}}, ${x}, %x%, %%x%%, ##x##, __x__ | Centro di Assistenza Smartling, JSON |
| Stringhe ICU generate da un messaggio con argomenti annidati prima che venga utilizzato il testo non elaborato. | 20 | Centro assistenza Smartling, formato messaggio ICU |
| Costruzioni ICU catturate come testo grezzo invece che come stringhe traducibili | 3 — selectordinal, più argomenti plurali in una stringa, plurale con una proprietà di offset | Centro assistenza Smartling, formato messaggio ICU |
| Pseudo-inflazione per JSON (solo argomento di caricamento API, non inline) | smartling.pseudo_inflation=70 allunga le pseudo traduzioni del 70% | Centro di Assistenza Smartling, JSON |
| Data in cui l'output predefinito del parser JSON è passato a json_format_strategy = source, in modo che non venga aggiunto alcuno spazio tra chiave e valore | 10 novembre 2025 | Centro di Assistenza Smartling, JSON |
| Piattaforme git supportate dal Repository Connector | 3 — GitHub, GitLab, Beanstalk | Centro di Assistenza Smartling, Panoramica del Connettore del Repository |
Come si collegano i file di traduzione di un progetto React Native a una pipeline di localizzazione?
Collegare i file di traduzione di un progetto React Native si svolge in cinque fasi: fissare la convenzione plurale, definire il file con le direttive, spingere un file di test attraverso la CLI, automatizzare il viaggio di andata e ritorno con un connettore repository, poi testare lunghezza e contesto prima della compilazione. La sequenza presuppone che le stringhe siano già esternalizzate in JSON per località.
- Correggi prima la convenzione del plurale : verifica se il progetto scrive chiavi per il plurale in stile i18next o in formato ICU MessageFormat. Se si utilizza react-i18next, è necessario aggiungere subito l'estensione ICU MessageFormat di i18next; convertire le chiavi al plurale dopo che sono state create diverse centinaia di stringhe rappresenta la versione più dispendiosa di questo passaggio.
- Definisci l'ambito del file con le direttive : aggiungi un blocco
translate_pathsche specifica i percorsi che contengono la copia dell'interfaccia utente, unexclude_pathper tutto ciò che non deve essere tradotto estring_format: icuse l'intero file è in formato ICU. Le direttive inline devono essere il primo oggetto nel file JSON, quindi vanno inserite nel file sorgente e non in una fase di compilazione. - Invia un file di test attraverso la CLI — esegui un comando a forma di
smartling-cli files push en.json --directive string_format=icue ispeziona le stringhe catturate nel cruscotto prima di collegare qualsiasi cosa al CI. Se il progetto estrae messaggi con FormatJS o react-intl, includere la--format=smartlingflag nel comando di estrazione in modo che l'output venga modellato come previsto dal parser. - Automatizza il viaggio di andata e ritorno — collega il repository tramite il GitHub Connector o il Repository Connector in modo che i file JSON modificati vengano caricati automaticamente e i file tradotti ritornino come pull request che passa attraverso la normale revisione del codice.
- Testa la lunghezza e il contesto prima della compilazione : richiedi pseudo-traduzioni come argomento di caricamento API per visualizzare l'espansione delle stringhe e carica screenshot o video in modo che i traduttori possano vedere la schermata nativa su cui viene visualizzata una stringa anziché un valore JSON isolato.
Questo approccio si adatta a squadre che...
- Distribuisci un'app React Native le cui stringhe già vivono in JSON per località invece che in componenti inline.
- Usa react-i18next o react-intl e servono plurali per sopravvivere al viaggio fino a un traduttore e tornare intatto.
- Tieni i file locali in un repository GitHub, GitLab o Beanstalk e vuoi che le traduzioni vengano restituite come pull request revisionabile invece che come esportazione e importazione manuale.
- Supporta abbastanza località che controllare manualmente ogni file JSON restituito per la deriva delle chiavi ha smesso di essere realistico.
- Sono stato danneggiato da un bug di traduzione che è rimasto in produzione mentre una recensione sull'app store era in corso, e sto valutando la consegna in tempo reale rispetto al bundleing.
Quando questa potrebbe non essere la priorità giusta
- Un'app React Native che non ha ancora esternalizzato le sue stringhe — il lavoro di estrazione avviene prima di qualsiasi decisione sulla pipeline, e un connettore non ha nulla a cui collegarsi finché non è terminato.
- Un'unica lingua aggiuntiva senza cadenza di aggiornamento, dove tradurre manualmente un file JSON costa meno che configurare direttive e un connettore di repository.
- Teams la cui app React Native renderizza quasi interamente contenuti consegnati dal server, dove il problema di localizzazione risiede nella pipeline di contenuti backend piuttosto che nei file di risorse dell'app.
Checklist per la valutazione: domande da porre prima di localizzare un'app React Native
Quale convenzione del plurale utilizzano già le nostre chiavi?
I suffissi plurali in stile i18next e il formato dei messaggi ICU non sono intercambiabili senza una fase di conversione. Smartling non analizza il formato plurale nativo di i18next, quindi un progetto react-i18next necessita dell'estensione ICU MessageFormat di i18next prima che il set di chiavi si espanda.
Qualche messaggio usa una costruzione che torna come testo grezzo?
selectordinal, più di un argomento plurale in una singola stringa, e un plurale con proprietà di offset sono tutti catturati come sintassi grezze della ICU. Dividere quei messaggi in messaggi più semplici di solito costa meno che chiedere ai traduttori di modificare manualmente la sintassi.
Come può un traduttore vedere lo schermo su cui appare una stringa?
JSON non riceve un contesto visivo automatico e gli strumenti di cattura basati su browser non possono leggere una gerarchia di viste React Native. Decidi presto se il contesto proviene da screenshot, video o dall'API Context.
Le nostre corde più lunghe entrano ancora sullo schermo più piccolo supportato?
Richiedi pseudo traduzioni come argomento di caricamento API per gonfiare la lunghezza della stringa prima che un traduttore tocchi il file, e imposta un limite di caratteri sulle stringhe sorgente che si trovano in un'interfaccia utente stretta.
Una correzione di traduzione richiede una release dello store di app?
Se il file JSON con le impostazioni locali è incluso, la risposta è sì, e si tratta di una decisione relativa al prodotto tanto quanto a quella ingegneristica. Il recupero delle traduzioni in fase di esecuzione elimina la dipendenza, ma aggiunge la gestione della cache e il comportamento offline.
Abbiamo gestito il layout da destra a sinistra separatamente dalla traduzione?
React Native espone un'API I18nManager per il layout da destra a sinistra, e invertire un layout è un flusso di lavoro distinto dalla traduzione delle stringhe al suo interno.
Come Smartling supporta un flusso di lavoro di localizzazione React Native
Smartling non fornisce un SDK per React Native, un pacchetto npm o un plugin specifico per React Native. Il supporto per un progetto React Native include un parser di file JSON generico, oltre al repository, alla CLI e al livello API, in linea con la descrizione generale del supporto per dispositivi mobili fornita da Smartling: i formati di file standard per dispositivi mobili vengono gestiti automaticamente e non sono necessari SDK per gestire i file di risorse in un progetto Smartling. Per un team che sviluppa con React Native, la conseguenza pratica è che la configurazione avviene nelle direttive del parser JSON, e non nell'integrazione con un framework.
Quel parser è più configurabile di un lettore JSON generico. translate_paths scopre quali percorsi diventano stringhe traducibili e quali diventano istruzioni o chiavi traduttibili; exclude_path rimuove i sotto-percorsi; character_limit limita la lunghezza tradotta su base per stringa, impostata sulla stringa sorgente e applicata a ogni lingua, che è la risposta diretta a un'etichetta di pulsante che si adatta in inglese e si sovrappone in tedesco; e variants_enabled con un percorso di tasti mantiene le stringhe uniche quando la stessa parola inglese appare sotto tonalità diverse. Impostando string_format per icu analizzar i plurali e selezionare invece di appiattirli, la documentazione ICU MessageFormat di Smartling indica che gli utenti di react-i18next sull'estensione ICU MessageFormat di i18next raggiungano quel supporto.
Per lo spostamento dei file, il Repository Connector di Smartling funziona con GitHub, GitLab e Beanstalk, rilevando file di risorse modificate e restituendo traduzioni al repository, mentre la CLI di Smartling spinge un file con direttive fornite nella riga di comando per i team che scriptano il proprio passo di build. Dove l'aggregazione delle traduzioni nell'app è il vincolo più che il trasferimento, l'API di Consegna delle Traduzioni di Smartling è l'opzione runtime: un'API ad alta disponibilità e non bloccante, progettata per il recupero a bassa latenza di contenuti localizzati serviti a siti web e app mobili, che permette a una modifica di stringa di raggiungere gli utenti senza un nuovo binario.
Pronto a vedere Smartling in azione?
Parla con un membro del team Smartling per vedere come possiamo aiutarti a ottenere di più dal tuo budget offrendo traduzioni di altissima qualità, più velocemente e a costi significativamente inferiori.