# gt-next: General Translation Next.js SDK: withGTConfig
URL: https://generaltranslation.com/es/docs/next/api/config/with-gt-config.mdx
---
title: withGTConfig
description: Referencia de la API de withGTConfig(), anteriormente initGT()
---

## Resumen

`withGTConfig` es la forma principal de configurar la biblioteca `gt-next`.
Envuelve directamente un objeto `NextConfig`.

```js title="next.config.mjs"
import { withGTConfig } from 'gt-next/config';

const nextConfig = {
    // tu next.config.js existente
}

export default withGTConfig(nextConfig, {
  // Opciones de configuración adicionales
});
```

<Callout>
  **Legado**

  `initGT` es la forma heredada de configurar la biblioteca `gt-next`. Devuelve una función callback que luego se invoca con el objeto `NextConfig`.
  Las propiedades de ambas funciones son las mismas, con la excepción de que `withGTProps` requiere pasar también `NextConfig`.
</Callout>

Usa `withGTConfig` para:

* Configurar los idiomas compatibles y la configuración regional predeterminada (es decir, el idioma alternativo).
* Establecer claves API e ID del proyecto para acceder a los servicios de GT.
* Establecer el comportamiento de carga.
* Configurar los tiempos de espera.
* Configurar endpoints personalizados.
* Personalizar el comportamiento de traducción, el almacenamiento en caché y el procesamiento por lotes de solicitudes.
* Configurar la validación en tiempo de compilación mediante el plugin de SWC.

<Callout>
  `withGTConfig` debe usarse en tu archivo `next.config.js` para habilitar la funcionalidad de traducción.
</Callout>


## Referencia

Por defecto, `withGTConfig` buscará un archivo `gt.config.json` en el mismo directorio que tu archivo `next.config.js`.

Este archivo JSON se cargará y se combinará con la configuración que se pase a `withGTConfig`.

Consulta la referencia de [gt.config.json](/docs/next/api/config/gt-config-json) para obtener más información sobre el archivo de configuración.

<Callout>
  La herramienta CLI solo leerá la configuración del archivo `gt.config.json`, por lo que
  recomendamos usar el archivo `gt.config.json` como fuente de verdad para tu aplicación.

  Las opciones de configuración adicionales que no estén en el archivo `gt.config.json` pueden pasarse directamente a `withGTConfig` como propiedades.
</Callout>

### Propiedades obligatorias

<TypeTable
  type={{
  "nextConfig": {
    type: 'NextConfig',
    optional: false,
  },
}}
/>

### Propiedades recomendadas

<TypeTable
  type={{
  "defaultLocale?": {
      type: 'string',
      optional: true,
      default: "locales[0] || 'en'"
  },
  "locales?": {
      type: 'string[]',
      optional: true,
      default: 'undefined',
  },
  "description?": {
      type: 'string',
      optional: true,
      default: 'undefined',
  },
}}
/>

| Prop            | Descripción                                                                                                                                                                                                                                                                                                           |
| --------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `defaultLocale` | Configuración regional predeterminada para la aplicación. El inglés será el idioma alternativo si no se especifica ninguna.                                                                                                                                                                                           |
| `locales`       | Una lista exclusiva de configuraciones regionales compatibles para la aplicación. Si se recibe una solicitud para una configuración regional no compatible, se redirigirá al siguiente idioma preferido del navegador en la lista. Se usará `defaultLocale` como alternativa si no se encuentra ninguna coincidencia. |
| `description`   | Una descripción del sitio en lenguaje natural, usada para facilitar la traducción.                                                                                                                                                                                                                                    |

### Propiedades avanzadas

<TypeTable
  type={{
      "projectId?": {
              type: 'string',
              optional: true,
      },
      "apiKey?": {
              type: 'string',
              optional: true,
      },
      "devApiKey?": {
              type: 'string',
              optional: true,
      },
      "preferredModelProvider?": {
              type: '"anthropic" | "openai"',
              optional: true,
      },
      "runtimeUrl?": {
              type: 'string',
              optional: true,
      },
      "cacheUrl?": {
              type: 'string',
              optional: true,
      },
      "cacheExpiryTime?": {
          type: 'number',
          optional: true,
          default: 60000,
      },
      "renderSettings?": {
          type: 'RenderSettings',
          optional: true,
      },
      "maxConcurrentRequests?": {
          type: 'number',
          optional: true,
          default: 100,
      },
      "batchInterval?": {
          type: 'number',
          optional: true,
          default: 50,
      },
      "maxBatchSize?": {
          type: 'number',
          optional: true,
          default: 25,
      },
      "dictionary?": {
          type: 'string',
          optional: true,
      },
      "dynamicJsxCheckLogLevel?": {
          type: '"error" | "warn" | "off"',
          optional: true,
          default: '"warn"',
      },
      "dynamicStringCheckLogLevel?": {
          type: '"error" | "warn" | "off"',
          optional: true,
          default: '"warn"',
      },
  }}
/>

| Prop                         | Descripción                                                                                                                                                                                                                                                                                                                                              |
| ---------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `projectId`                  | ID del proyecto, que puedes incluir aquí o como variable de entorno.                                                                                                                                                                                                                                                                                     |
| `apiKey`                     | Aunque no se recomienda, puedes incluir aquí una clave API. También puede incluirse como variable de entorno.                                                                                                                                                                                                                                            |
| `devApiKey`                  | Aunque no se recomienda, puedes incluir aquí una clave API de desarrollo. También puede incluirse como variable de entorno.                                                                                                                                                                                                                              |
| `preferredModelProvider`     | Tu proveedor de modelos de IA preferido. Actualmente, solo [Anthropic](https://anthropic.com) y [OpenAI](https://openai.com) están habilitados. Déjalo en blanco y determinaremos el mejor proveedor para cada traducción. En periodos de uso elevado o cuando un proveedor esté deshabilitado, no podemos garantizar que se use tu proveedor preferido. |
| `runtimeUrl`                 | URL base de la API de GT. Para deshabilitar la traducción automática, establécela como una cadena vacía.                                                                                                                                                                                                                                                 |
| `cacheUrl`                   | URL donde se almacenan las traducciones en caché. Se puede personalizar para que apunte a un servidor de caché personalizado.                                                                                                                                                                                                                            |
| `cacheExpiryTime`            | Tiempo, en milisegundos, antes de que caduquen las traducciones almacenadas en caché de forma local.                                                                                                                                                                                                                                                     |
| `renderSettings`             | Objeto que especifica el comportamiento de carga de las traducciones en tiempo de ejecución.                                                                                                                                                                                                                                                             |
| `maxConcurrentRequests`      | Número máximo de solicitudes de traducción simultáneas permitidas a la API de GT.                                                                                                                                                                                                                                                                        |
| `maxBatchSize`               | Número máximo de traducciones que se agrupan antes de enviar una solicitud.                                                                                                                                                                                                                                                                              |
| `batchInterval`              | Intervalo, en milisegundos, entre solicitudes de traducción por lotes. Ayuda a controlar la frecuencia con la que se envían las solicitudes.                                                                                                                                                                                                             |
| `dictionary`                 | Ruta de archivo de configuración opcional para el diccionario. Al igual que `i18n`, acepta una cadena para especificar una ruta personalizada. Los diccionarios llamados `dictionary.js` (o `.jsx`, `.ts`, `.tsx`, etc.) y ubicados en la raíz o en la carpeta `src` son compatibles por defecto.                                                        |
| `dynamicJsxCheckLogLevel`    | Controla la validación del contenido dinámico no envuelto en componentes de traducción. Establécelo en `"error"` para que la compilación falle, en `"warn"` para mostrar advertencias, o en `"off"` para deshabilitar la comprobación.                                                                                                                   |
| `dynamicStringCheckLogLevel` | Controla la validación de los argumentos de la función de traducción para garantizar que se usen literales de cadena. Establécelo en `"error"` para que la compilación falle, en `"warn"` para mostrar advertencias, o en `"off"` para deshabilitar la comprobación.                                                                                     |

### Devuelve

Una función `(NextConfig) => NextConfig` que extiende el objeto de configuración de Next.js con la configuración de GT especificada.

### Excepciones

Lanza un `Error` si falta `projectId` y se usan las URL predeterminadas, o si se requiere la clave API y no está presente.

***

## Configuración de renderizado

La configuración de renderizado controla cómo se comportan las traducciones mientras se cargan.
Esto solo se aplica a las traducciones que ocurren en tiempo de ejecución.
Si la traducción está en caché, el tiempo de respuesta es demasiado bajo para justificar un estado de carga.

<TypeTable
  type={{
  method: {
      description: 'El método usado para renderizar la página.',
      type: '"skeleton" | "replace" | "default"',
      optional: false,
      default: "default"
  },
  timout: {
      description: 'El tiempo en milisegundos antes de que expire el tiempo de espera del método.',
      type: 'number',
      optional: true,
      default: 8000,
  },
}}
/>

| Prop      | Descripción                                                                                                       |
| --------- | ----------------------------------------------------------------------------------------------------------------- |
| `method`  | El método usado para renderizar la página. Las opciones son `skeleton`, `replace` y `default`.                    |
| `timeout` | El tiempo en milisegundos antes de que expire el tiempo de espera del método. El valor predeterminado es 8000 ms. |

### Métodos de renderizado

* `skeleton`: Renderiza un fragmento.
* `replace`: Renderiza el contenido en el idioma predeterminado mientras se espera.
* `default`: Para locales con el mismo idioma (es decir, `en-US` y `en-GB`), se comporta como `replace`. Para locales con idiomas diferentes (es decir, `en-US` y `fr`), se comporta como `skeleton`.

### Tiempo de espera

Los tiempos de espera solo se aplican a las traducciones en tiempo de ejecución, o a las traducciones que deben realizarse bajo demanda porque no se han almacenado en caché.

Los tiempos de espera se establecen en 8 segundos por defecto.
Esta decisión de diseño busca ayudar a los usuarios de vercel, que tienen un tiempo de espera predeterminado de 10 segundos para las funciones sin servidor en el plan gratuito.

***

## Ejemplos

### Configuración de renderizado

Este ejemplo configura `gt-next` para renderizar un skeleton mientras espera a que se carguen las traducciones.
Si la traducción tarda más de 8 segundos, el método superará el tiempo de espera y renderizará el contenido del idioma predeterminado.

```json title="gt.config.json"
{
  "defaultLocale": "en-US",
  "locales": ["en-US", "es", "fr"],
}
```

```js title="next.config.mjs" copy
import { withGTConfig } from 'gt-next/config';

const nextConfig = {
  // Tus otras configuraciones de Next.js
};

export default withGTConfig(nextConfig, {
  renderSettings: {
    method: 'skeleton',
    timeout: 10000,
  },
});
```


### Validación en tiempo de compilación

Este ejemplo configura el plugin de SWC para tratar las violaciones por contenido dinámico como errores de compilación en lugar de advertencias.

```js title="next.config.mjs" copy
import { withGTConfig } from 'gt-next/config';

const nextConfig = {
  // Tus otras configuraciones de Next.js
};

export default withGTConfig(nextConfig, {
  // Fallar la compilación por violaciones de JSX dinámico
  dynamicJsxCheckLogLevel: 'error',
  // Advertir sobre violaciones de cadenas dinámicas  
  dynamicStringCheckLogLevel: 'warn',
});
```

***


## Notas

* `withGTConfig` integra la funcionalidad de traducción de GT en tu aplicación de Next.js y debe usarse en el archivo de configuración raíz.
* Parámetros como `apiKey` y `projectId` pueden establecerse directamente en la configuración o como variables de entorno.
* Parámetros avanzados como `renderSettings` y `_batchInterval` permiten un control detallado del comportamiento de la traducción y del rendimiento.

## Próximos pasos

* Agrega la [traducción a tu proceso de CD](/docs/next/tutorials/quickdeploy).