# General Translation React SDKs (gt-react, gt-next, gt-react-native): Migración de bibliotecas de i18n
URL: https://generaltranslation.com/es/docs/react/guides/migrating-i18n-libraries.mdx
---

title: Migración de bibliotecas de i18n
description: Cómo migrar una configuración de internacionalización de React existente a General Translation sin descartar las traducciones actuales.
related:
  links:
    - /docs/react/guides/translating-with-dictionaries
    - /docs/react/guides/translating-jsx
    - /docs/react/guides/translating-strings
    - /docs/react/guides/configuring

---

Migra una funcionalidad o ruta completa a la vez para que la selección de la configuración regional, la salida traducida y el comportamiento del contenido alternativo se puedan probar durante todo el proceso.

## Antes de empezar [#before-start]

Completa el Quickstart de tu framework y mantén activo el proveedor de i18n actual hasta migrar su último consumidor:

* [React SPA Quickstart](/docs/react/react-spa-quickstart)
* [Next.js Quickstart](/docs/react/nextjs-quickstart)
* [TanStack Start Quickstart](/docs/react/tanstack-start-quickstart)
* [React Native Quickstart](/docs/react/react-native-quickstart)

Anota la configuración regional de origen actual, las configuraciones regionales compatibles, el comportamiento del contenido alternativo y el formato de las URL de configuración regional. Usa los mismos valores en `gt.config.json` antes de migrar el contenido.

## Elige una estrategia de migración [#strategies]

### Sustituye las claves por contenido de origen

Elige este enfoque cuando quieras que el texto traducible esté junto al componente que lo renderiza.

Sustituye las búsquedas de claves por [`<T>`](/docs/react/reference/components/t) para JSX y [`useGT`](/docs/react/reference/hooks/use-gt) para cadenas:

```tsx
// Antes
const { t } = useTranslation();
return <h1>{t('home.welcome')}</h1>;

// Después
return (
  <T>
    <h1>Welcome back</h1>
  </T>
);
```

Copia el valor de la configuración regional de origen del diccionario anterior en lugar del valor traducido. General Translation utiliza ese contenido de origen y la estructura que lo rodea como contexto de traducción.

### Conserva los diccionarios existentes

Elige este enfoque cuando las claves estables formen parte de tu flujo de trabajo de contenido o cuando no sea necesario reemplazar todas las búsquedas.

Mueve el diccionario de origen a la [configuración de diccionarios](/docs/react/guides/translating-with-dictionaries) y luego reemplaza el hook anterior por [`useTranslations`](/docs/react/reference/hooks/use-translations):

```tsx
// Antes
import { useTranslation } from 'react-i18next';

const { t } = useTranslation();
return <h1>{t('home.welcome')}</h1>;

// Después
import { useTranslations } from 'gt-react';

const t = useTranslations();
return <h1>{t('home.welcome')}</h1>;
```

En Next.js, coloca `dictionary.json`, `dictionary.ts` o `dictionary.js` en la raíz del proyecto o en `src/`. [`withGTConfig`](/docs/react/nextjs/config) lo detectará automáticamente.

### Ejecute ambas bibliotecas temporalmente

Elija este enfoque para una migración por fases entre rutas o funcionalidades que se implementan de forma independiente. Ambas bibliotecas pueden ejecutarse simultáneamente y, cuando ambas integraciones usan proveedores, estos pueden coexistir. Cada cadena debe tener un único responsable de traducción y ambas bibliotecas deben recibir la misma configuración regional activa.

<Callout type="warn">
  Dos bibliotecas de i18n pueden diferir en cuanto a la configuración regional activa, las cookies, el enrutamiento de URL y las reglas de contenido alternativo. Defina una única fuente de verdad para la configuración regional, pruebe la navegación entre rutas migradas y no migradas, y elimine el proveedor anterior en cuanto deje de tener consumidores.
</Callout>

## Migra una funcionalidad [#migrate-feature]

1. Elige una ruta o un componente y enumera todas las claves de traducción antiguas que consulta.
2. Copia el texto de la configuración regional de origen y cualquier interpolación o regla de plural.
3. Sustituye cada consulta por [`<T>`](/docs/react/reference/components/t), [`useGT`](/docs/react/reference/hooks/use-gt) o [`useTranslations`](/docs/react/reference/hooks/use-translations), según la estrategia que hayas elegido.
4. Conserva las variables como variables en lugar de insertar sus valores actuales en el texto de origen.
5. Ejecuta [`npx gt translate`](/docs/cli/reference/commands/translate).
6. Prueba la configuración regional de origen, cada configuración regional de destino, el contenido alternativo para traducciones faltantes y el cambio de configuración regional.
7. Elimina las claves antiguas solo cuando ya no haya referencias a ellas en el repositorio.

Repite esta secuencia hasta que el proveedor y la dependencia antiguos no tengan consumidores; después, elimina su configuración, los archivos generados y los comandos de compilación.

## Conserva las traducciones existentes [#preserve-translations]

Mantener un diccionario de origen conserva las claves, pero los archivos existentes en los idiomas de destino no se importan automáticamente a General Translation. Sigue cargando esos diccionarios durante la migración o sube las traducciones revisadas mediante el [flujo de trabajo de carga de Core](/docs/platform/core/reference/gt-class-methods/translation/upload-translations).

No copies manualmente cadenas traducidas en [`<T>`](/docs/react/reference/components/t) como contenido de origen. Mantén el idioma de origen original en el código y verifica las traducciones importadas con la misma versión de origen.
## Next steps

- /docs/react/guides/translating-with-dictionaries
- /docs/react/guides/translating-jsx
- /docs/react/guides/translating-strings
- /docs/react/guides/configuring