# gt-next: General Translation Next.js SDK: Almacenamiento local de traducciones
URL: https://generaltranslation.com/es/docs/next/guides/local-tx.mdx
---
title: Almacenamiento local de traducciones
description: Almacena las traducciones en el bundle de tu aplicación en lugar de usar una CDN
---

## ¿Qué son las traducciones locales?

Las traducciones locales se almacenan en el bundle de tu aplicación, en lugar de obtenerse desde una CDN (Content Distribution Network). Cuando añades el comando `gt translate` a tu proceso de compilación, se generan traducciones en formato JSON. El paso final es hacer que estas traducciones estén disponibles en tu aplicación para poder usarse.

Hay dos formas de hacerlo:

1. **En el bundle de tu aplicación** (local): Guarda las traducciones en el bundle de tu aplicación después de generarlas
2. **En una CDN** (predeterminado): Obtén las traducciones desde una CDN en tiempo de ejecución

Por defecto, `gt-next` obtiene las traducciones desde la CDN de General Translation. Cuando traduces tu aplicación con nuestra API, las traducciones se guardan automáticamente en nuestra CDN.

<Callout>
  **Comportamiento predeterminado:** GT usa almacenamiento en CDN por defecto. Cambia al almacenamiento local solo si necesitas las ventajas específicas que ofrece.
</Callout>

## Consideraciones

### Beneficios de las traducciones locales

* **Menor tiempo de carga**: Las traducciones locales se sirven directamente desde tu aplicación, por lo que cargan más rápido que las traducciones servidas desde una CDN
* **Sin dependencia de servicios externos**: La capacidad de tu aplicación para cargar traducciones no depende de la disponibilidad de la CDN. Si no se encuentran traducciones para una configuración regional, la aplicación vuelve automáticamente al idioma predeterminado
* **Funciona sin conexión**: Las traducciones vienen empaquetadas con tu aplicación

### Desventajas de las traducciones locales

* **Aumento del tamaño del bundle**: Las traducciones locales aumentan el tamaño del bundle de tu aplicación, lo que puede hacer que tarde más en cargarse al principio
* **Gestión de contenido**: Para editar una traducción, debes volver a desplegar tu aplicación con la nueva traducción cada vez que realices cambios

## Configuración

### Paso 1: Crear la función de carga

Agrega un archivo `loadTranslations.[js|ts]` en `./src` con el siguiente contenido:

```ts title="src/loadTranslations.ts"
export default async function loadTranslations(locale: string) {
  const translations = await import(`../public/_gt/${locale}.json`);
  return translations.default;
}
```

[`withGTConfig`](/docs/next/api/config/with-gt-config) detecta automáticamente el archivo `loadTranslations.[js|ts]` en tu directorio `src/` o en la raíz del proyecto.


### Paso 2: Configura la CLI

Ejecuta el comando de configuración y selecciona el almacenamiento local:

```bash
npx gt configure
```

Cuando se te indique lo siguiente:

* **¿Guardar en CDN?** Selecciona &quot;No&quot;
* **Directorio de traducción:** Introduce `./public/_gt`

Como alternativa, puedes configurar manualmente el archivo `gt.config.json` para usar traducciones locales. Consulta la [documentación de configuración del CLI](/docs/cli/reference/config) para obtener más información.


### Paso 3: Generar traducciones

Ahora, al ejecutar el comando translate, las traducciones se descargarán automáticamente y se incluirán en tu base de código:

```bash
npx gt translate
```

Las traducciones se almacenarán en `public/_gt/` y se empaquetarán con tu aplicación.


## Integración en la compilación

### Proceso de compilación de Next.js

Agrega la generación de traducciones a tu script de compilación:

```json
{
  "scripts": {
    "build": "npx gt translate && <...YOUR_BUILD_COMMAND...>"
  }
}
```


### Pipeline de CI/CD

```yaml
# .github/workflows/deploy.yml
- name: Generate Translations
  run: npx gt translate
  
- name: Build Application  
  run: npm run build
```


## Problemas comunes

### Faltan archivos de traducción

Asegúrate de generar las traducciones antes de compilar:

```bash
# ❌ Compilar sin traducciones
<...YOUR_BUILD_COMMAND...>

# ✅ Generar traducciones primero
npx gt translate && <...YOUR_BUILD_COMMAND...>
```


### Errores en la ruta de importación

Haz coincidir la estructura de directorios en la función de carga:

```ts
// ❌ Ruta incorrecta
const t = await import(`../translations/${locale}.json`);

// ✅ Ruta correcta para public/_gt
const t = await import(`../public/_gt/${locale}.json`);
```


### Bundle de gran tamaño

Considera dividir el código en aplicaciones con muchos idiomas:

```ts
// Cargar traducciones solo cuando sea necesario
export default async function loadTranslations(locale: string) {
  // Solo cargar si la configuración regional está activa
  if (locale === getCurrentLocale()) {
    const translations = await import(`../public/_gt/${locale}.json`);
    return translations.default;
  }
  return {};
}
```

<Callout>
  El almacenamiento local funciona mejor para aplicaciones con traducciones estables que no requieren actualizaciones frecuentes.
</Callout>


## Próximos pasos

* [Guía de middleware](/docs/next/guides/middleware) - Detección del idioma y enrutamiento
* [Guía de idiomas](/docs/next/guides/languages) - Configurar los idiomas compatibles
* Referencias de la API: