Inline Translations

getMessages

API-Referenz zur Übersetzungsfunktion getMessages() für Zeichenketten

Übersicht

Die Funktion getMessages ist eine asynchrone Funktion, die zur Build‑Zeit kodierte Strings aus msg übersetzt.

const m = await getMessages();

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

Buildtime Translation: getMessages-Übersetzungen erfolgen während der Build-Phase, bevor Ihre App deployt wird. Sie können encoded strings aus msg übergeben; diese werden in die bevorzugte Sprache der Nutzer:innen übersetzt.

Referenz

Parameter

Keine

Rückgabewert

Ein Promise, das eine Callback-Funktion m zurückgibt, die den bereitgestellten kodierten Inhalt aus msg übersetzt.

Promise<(encodedContent: string, options?: Record<string, any>) => string>
NameTypeDescription
encodedContentstringDie kodierte Zeichenkette aus msg, die übersetzt werden soll.
options?Record<string, any>Optionale Parameter, mit denen Variablen an die kodierte Zeichenkette übergeben werden.

Verhalten

Produktion

Während des CD-Prozesses wird sämtlicher Inhalt innerhalb einer msg-Funktion übersetzt, bevor Ihre Anwendung bereitgestellt wird. Das gewährleistet schnelle Ladezeiten für alle Locales, kann jedoch nur Inhalte übersetzen, die zur Build-Zeit bekannt sind.

Nach der Generierung werden die Übersetzungen je nach Konfiguration entweder (1) im CDN (Content Delivery Network) gespeichert oder (2) im Build-Output Ihrer App abgelegt. Von dort wird der übersetzte Inhalt an Ihre Nutzenden ausgeliefert. Wenn keine Übersetzung gefunden wird, erfolgt ein Fallback auf den ursprünglichen Inhalt.

Stellen Sie sicher, dass Sie der Bereitstellungsanleitung hier folgen.

Entwicklung

Während der Entwicklung übersetzt die Funktion m Inhalte bei Bedarf. Das ist hilfreich, um zu prototypisieren, wie Ihre App in verschiedenen Sprachen aussehen wird. Denken Sie daran, Ihrer Umgebung einen Dev API key hinzuzufügen, um dieses Verhalten zu aktivieren.

Bei bedarfsweiser Übersetzung in der Entwicklung kann es zu einer Verzögerung kommen. Dies tritt bei Produktions-Builds nicht auf, es sei denn, Inhalte werden explizit bei Bedarf übersetzt, d. h. mithilfe von tx oder <Tx>.


Beispiel

Grundlegende Verwendung

Sie können getMessages verwenden, um encoded strings aus msg zu übersetzen.

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

const encodedGreeting = msg('Hallo, Alice!');

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

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

Hinweis: "Alice" wird in die bevorzugte Sprache des Benutzers übersetzt.

Verwendung von Variablen

Sie können Variablen an kodierte Strings übergeben.

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

const encodedGreeting = msg('Hello, {name}!');

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

  return (
    <p>
      {m(encodedGreeting, { name: 'Bob' })} {/* Dies zeigt „Hello, Bob!" an */}
    </p>
  );
}

msg-Variablen überschreiben m-Variablen

Wenn du Variablen sowohl an msg als auch an m übergibst, überschreiben die an msg übergebenen die an m übergebenen Variablen.

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

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

export default async function TranslateGreeting() {
  const m = await getMessages();
  return (
    <p>
      {m(encodedGreeting, { name: 'Bob' })}
    </p>
  );
}

Hinweis: Dadurch wird "Hello, Alice!" angezeigt – die Variable wird beim Rendern nicht überschrieben.

Verwendung des ICU Message Formats

gt-next unterstützt das ICU Message Format, mit dem Sie auch Ihre Variablen formatieren können.

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

const encodedMessage = msg('Im Warenkorb {count, plural, =0 {sind keine Artikel} =1 {ist ein Artikel} other {sind {count} Artikel}}', { count: 10 });

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

Das ICU‑Message‑Format ist eine leistungsstarke Methode zum Formatieren Ihrer Variablen. Weitere Informationen finden Sie in der Dokumentation zum ICU‑Message‑Format.


Hinweise

  • Die Funktion getMessages ist serverseitig und übersetzt kodierte Zeichenketten aus msg.
  • Übersetzungen mit getMessages erfolgen vor der Laufzeit, während des Build-Prozesses (außer in der Entwicklung).

Nächste Schritte

  • Siehe useMessages für clientseitige Zeichenkettenübersetzungen aus kodierten Strings zur Build‑Zeit.
  • Siehe msg zum Kodieren von Strings für die Übersetzung.
  • Für Übersetzungen zur Laufzeit siehe tx und <Tx>.

Wie ist diese Anleitung?