Bridge-Modus

Behalten Sie Ihre bestehende i18n-Bibliothek bei und fügen Sie gleichzeitig die typsichere Autovervollständigung, KI-Übersetzung und Dateiverwaltung von i1n hinzu.

Was ist der Bridge-Modus?

Der Bridge-Modus ermöglicht es Ihnen, Ihre bestehende i18n-Bibliothek (i18next, react-intl, vue-i18n, ngx-translate, i18n-js) beizubehalten und gleichzeitig i1n zur Verwaltung von Übersetzungsdateien, KI-Übersetzungen und Typengenerierung zu verwenden.

Verbinden Sie Ihre Bibliothek mit einer einzigen Zeile über registerI1n(). Die i1n t()-Funktion delegiert im Hintergrund an Ihre Bibliothek, jedoch mit strenger Typüberprüfung und vollständiger IDE-Autovervollständigung aus der generierten i1n.d.ts.

Einrichtung durch Bibliothek

Eine Zeile pro Bibliothek. Rufen Sie registerI1n() mit der Übersetzungsfunktion Ihrer Bibliothek auf und fertig – i1n kümmert sich um den Rest. Sehen Sie sich die Codebeispiele unten für Ihre spezifische Einrichtung an.

vue-i18n: registerI1n((key, params) => i18n.global.t(key, params)). ngx-translate (Angular): registerI1n((key, params) => translateService.instant(key, params)). i18n-js (React Native): registerI1n((key, params) => i18n.t(key, params)).

Benutzerdefinierte Funktion: registerI1n((key, params) => yourLookup(key, params)). Der Bridge-Modus funktioniert mit jeder Funktion, die einen Schlüssel und optionale Parameter entgegennimmt und einen String zurückgibt.

So funktioniert's

Nach dem Aufruf von registerI1n() wird jeder Aufruf der i1n t()-Funktion an Ihren registrierten Callback weitergeleitet. i1n fügt Typsicherheit hinzu — wenn ein Schlüssel in Ihren Übersetzungsdateien nicht vorhanden ist, erkennt TypeScript den Fehler zur Kompilierungszeit.

i1n verwaltet weiterhin die Übersetzungsdateien (push, pull, KI-Übersetzung) und generiert i1n.d.ts. Ihre Bibliothek kümmert sich weiterhin um Laufzeit-Laden, Interpolation und Pluralisierung. Beide Systeme arbeiten nahtlos zusammen.

Wann Brückenmodus vs. eigenständiger Modus verwendet werden soll

Verwenden Sie den Bridge-Modus, wenn Sie ein bestehendes Projekt mit einer etablierten i18n-Bibliothek haben und den Anwendungscode nicht neu schreiben möchten. Der Bridge-Modus bietet einen kostenlosen Migrationspfad – Sie können die Infrastruktur von i1n übernehmen, ohne eine einzige Komponente zu ändern.

Verwenden Sie den Standalone-Modus für neue Projekte oder wenn Sie Ihre i18n-Bibliothek vollständig ersetzen möchten. Das i1n SDK übernimmt die Initialisierung, Interpolation, Pluralisierung und den Locale-Wechsel nativ, ohne externe Abhängigkeiten.

i18next (React, Next.js, Remix)

import { registerI1n } from 'i1n'
import i18next from 'i18next'

registerI1n((key, params) => i18next.t(key, params))

react-intl (FormatJS)

import { registerI1n } from 'i1n'
import { useIntl } from 'react-intl'

const intl = useIntl()
registerI1n((key, params) => intl.formatMessage({ id: key }, params))

vue-i18n

import { registerI1n } from 'i1n'
import { useI18n } from 'vue-i18n'

const { t } = useI18n()
registerI1n((key, params) => t(key, params))

ngx-translate (Angular)

import { registerI1n } from 'i1n'
import { TranslateService } from '@ngx-translate/core'

constructor(private translate: TranslateService) {
  registerI1n((key, params) => this.translate.instant(key, params))
}

i18n-js (React Native)

import { registerI1n } from 'i1n'
import { I18n } from 'i18n-js'

const i18n = new I18n(translations)
registerI1n((key, params) => i18n.t(key, params))

Custom function

import { registerI1n } from 'i1n'

// Works with any function: (key, params?) => string
registerI1n((key, params) => myCustomLookup(key, params))

Verwandt

Armaturenbrett

Leitfaden für das i1n-Web-Dashboard: Kontoerstellung, Organisationen, API-Schlüssel, Übersetzungsbearbeitung und Teamverwaltung.