loadTranslations()

Descripción general

Utiliza loadTranslations() para especificar el comportamiento de carga de traducciones. Por defecto, tu aplicación cargará las traducciones desde el GT CDN en producción. Puedes especificar una función loadTranslations() para cargar traducciones desde una fuente diferente, como:

• Desde el paquete de tu aplicación (lo más común)
• Desde una base de datos
• Desde una API
• Desde un CDN diferente

Hemos integrado soporte para cargar traducciones desde archivos locales en el paquete de tu aplicación. Sigue esta guía para configurar traducciones locales en tu aplicación Next.js.

Si deseas definir manualmente tus propias traducciones, consulta la guía de traducciones personalizadas y la función loadDictionary().

Referencia

Parámetros

Descripción

Retorna

Un Promise<any> que resuelve a un diccionario que mapea ids a traducciones para el locale dado.

Configuración

Define tu loadTranslations() como la exportación por defecto de un archivo llamado loadTranslations.js o loadTranslations.ts ya sea en el directorio src/ o en la raíz. Asegúrate de que la función retorne una promesa que resuelva a un objeto con las traducciones para la localidad dada.

export default async function loadTranslations(locale) {
  const translations = await import(`../public/locales/${locale}.json`);
  return translations.default;
};

Si deseas usar un nombre o ruta diferente, pasa la ruta relativa a través del parámetro loadTranslationsPath en withGTConfig().

Ejemplos

Obtener traducciones desde tu paquete

export default async function loadTranslations(locale) {
  const translations = await import(`../public/locales/${locale}.json`);
  return translations.default;
};

Cuando está configurado para usar traducciones locales, el comando gtx-cli translate, guardará las traducciones en el árbol de archivos de tu proyecto.

Puedes generar archivos de traducción para tu paquete con este comando:

npx gtx-cli translate --no-publish --translations-dir ./public/locales

Cargar traducciones desde un CDN

export default async function loadTranslations(locale) {
  try {
    const translations = await fetch(`https://your-cdn.com/translations/${locale}.json`);
    const data = await translations.json();
    return data;
  } catch (e) {
    console.error(e);
    return {};
  }
};

Cargar traducciones desde tu propia base de datos

export default async function loadTranslations(locale) {
  try {
    const translations = await prisma.translation.findUnique({
      where: {
        locale: locale,
      },
    });
    return translations;
  } catch (e) {
    console.error(e);
    return {};
  }
};

Notas

• loadTranslations() te da la posibilidad de personalizar cómo se cargan las traducciones en tu aplicación en producción.
• Su caso de uso más común es para agregar traducciones locales

Próximos pasos

• Descubre por qué podrías querer usar traducciones locales
• Agrega tus propias traducciones con la guía de traducciones personalizadas