Überblick

Verwenden Sie loadTranslations, um das Ladeverhalten für Übersetzungen festzulegen. Standardmäßig lädt Ihre App Übersetzungen in der Produktion über das GT CDN. Sie können eine loadTranslations-Funktion angeben, um Übersetzungen aus einer anderen Quelle zu laden, zum Beispiel:

• Aus dem Bundle Ihrer App (am häufigsten)
• Aus einer Datenbank
• Über eine API
• Von einem anderen CDN

Wir bieten eine integrierte Unterstützung zum Laden von Übersetzungen aus lokalen Dateien im Bundle Ihrer App. Folgen Sie dieser Anleitung, um lokale Übersetzungen in Ihrer Next.js-App einzurichten.

Wenn Sie Ihre eigenen Übersetzungen manuell definieren möchten, sehen Sie sich die Anleitung für benutzerdefinierte Übersetzungen und die Funktion loadDictionary an.

Referenzen

Parameter

Beschreibung

Rückgabe

Ein Promise<any>, das zu einem Wörterbuch aufgelöst wird, das ids auf Übersetzungen für die angegebene locale abbildet.

Einrichtung

Exportieren Sie loadTranslations als Standardexport in einer Datei namens loadTranslations.js oder loadTranslations.ts im Verzeichnis src/ oder im Projektstamm. Stellen Sie sicher, dass die Funktion ein Promise zurückgibt, das auf ein Objekt mit Übersetzungen für die angegebene locale aufgelöst wird.

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

Wenn Sie einen anderen Namen oder Pfad verwenden möchten, übergeben Sie den relativen Pfad über den Parameter loadTranslationsPath in withGTConfig.

Beispiele

Übersetzungen aus Ihrem Bundle laden

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

Wenn die Verwendung von local translations konfiguriert ist, speichert der Befehl gtx-cli translate die Übersetzungen in der Verzeichnisstruktur Ihres Projekts.

npx gtx-cli translate

Übersetzungen aus einem CDN laden

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

Übersetzungen aus der eigenen Datenbank laden

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

Hinweise

• loadTranslations ermöglicht es Ihnen, die Ladeweise von Übersetzungen in Ihrer App für den Produktionsbetrieb anzupassen.
• Der häufigste Anwendungsfall ist das Hinzufügen von lokalen Übersetzungen

Nächste Schritte

• Erfahren Sie, warum Sie lokale Übersetzungen verwenden sollten
• Fügen Sie eigene Übersetzungen mit der Anleitung für benutzerdefinierte Übersetzungen hinzu