Descripción general

La función getMessages es una función asíncrona que traduce cadenas codificadas de msg en tiempo de compilación.

const m = await getMessages();

<p>{  m(cadenaCodificada)  }</p>;

Referencias

Parámetros

Ninguno

Valores devueltos

Una promesa que resuelve en una función de devolución de llamada, m, que traduce el contenido codificado proporcionado en msg.

Promise<(encodedContent: string, options?: Record<string, any>) => string>

Comportamiento

Producción

Durante el proceso de CD (Entrega/Despliegue Continuo), cualquier contenido dentro de una función msg se traducirá antes de que tu aplicación se implemente. Esto garantiza tiempos de carga rápidos para todos los locales, pero solo puede traducir contenido conocido en tiempo de compilación.

Una vez generadas, las traducciones se (1) almacenan en el CDN (Red de Distribución de Contenidos) o (2) se incluyen en el artefacto de build de tu app, según tu configuración. A partir de ahí, el contenido traducido se sirve a tus usuarios. Si no se encuentra una traducción, se recurrirá al contenido de respaldo predeterminado (el contenido original).

Asegúrate de seguir la guía de despliegue aquí.

Desarrollo

Durante el desarrollo, la función m traducirá contenido bajo demanda. Esto es útil para crear prototipos y ver cómo se verá tu app en diferentes idiomas. Recuerda agregar una clave de API de desarrollo (Dev API key) a tu entorno para habilitar este comportamiento.

Verás cierta latencia durante la traducción bajo demanda en desarrollo. Esto no ocurrirá en las compilaciones de producción a menos que el contenido se esté traduciendo explícitamente bajo demanda, es decir, usando tx o <Tx>.

Ejemplo

Uso básico

Puedes usar getMessages para traducir cadenas codificadas de msg.

import { msg, getMessages } from 'gt-next/server';

const encodedGreeting = msg('¡Hola, Alice!');

export default async function TranslateGreeting() {
  const m = await getMessages();

  return (
    <p>
      {m(encodedGreeting)}
    </p>
  );
}

Nota: "Alice" se traducirá al idioma preferido del usuario.

Uso de variables

Puedes reemplazar variables en cadenas codificadas.

import { msg, getMessages } from 'gt-next/server';

const encodedGreeting = msg('¡Hola, {name}!', { name: 'Alice' });

export default async function TranslateGreeting() {
  const m = await getMessages();

  return (
    <p>
      {m(encodedGreeting, { name: 'Bob' })}
    </p>
  );
}

Nota: Esto mostrará "Hello, Bob!"; la variable se sobrescribe en tiempo de renderizado.

Uso de ICU message format

gt-next es compatible con ICU message format, lo que también te permite dar formato a tus variables.

import { msg, getMessages } from 'gt-next/server';

const encodedMessage = msg('Hay {count, plural, =0 {ningún artículo} =1 {un artículo} other {{count} artículos}} en el carrito', { count: 10 });

export default async function TranslateGreeting() {
  const m = await getMessages();
  return (
    <p>
      {m(encodedMessage)}
    </p>
  );
}

Notas

• La función getMessages es una función del lado del servidor que traduce cadenas codificadas de msg.
• Las cadenas de traducción con getMessages se procesan antes de la ejecución, durante el proceso de compilación (salvo en entornos de desarrollo).

Próximos pasos

• Consulta useMessages para traducir cadenas en el cliente a partir de cadenas codificadas durante la compilación.
• Consulta msg para codificar cadenas para su traducción.
• Para traducciones en tiempo de ejecución, consulta tx y <Tx>.