Mode pont

Conservez votre bibliothèque i18n existante tout en ajoutant la saisie semi-automatique sécurisée, la traduction IA et la gestion de fichiers de i1n.

Qu'est-ce que le mode pont ?

Le mode Bridge vous permet de conserver votre bibliothèque i18n existante (i18next, react-intl, vue-i18n, ngx-translate, i18n-js) tout en utilisant i1n pour gérer les fichiers de traduction, la traduction par IA et la génération de types.

Connectez votre bibliothèque en une seule ligne à l'aide de registerI1n(). La fonction i1n t() délègue à votre bibliothèque en arrière-plan, mais avec une vérification de type stricte et une complétion automatique complète de l'IDE à partir du fichier i1n.d.ts généré.

Configuration par la bibliothèque

Une ligne par bibliothèque. Appelez registerI1n() avec la fonction de traduction de votre bibliothèque et c'est terminé — i1n s'occupe du reste. Consultez les exemples de code ci-dessous pour votre configuration spécifique.

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)).

Fonction personnalisée : registerI1n((key, params) => yourLookup(key, params)). Le mode Bridge fonctionne avec toute fonction qui prend une clé et des paramètres optionnels et renvoie une chaîne de caractères.

Comment ça marche

Après avoir appelé registerI1n(), chaque appel à la fonction i1n t() est transmis à votre rappel enregistré. i1n ajoute une sécurité de type — si une clé n'existe pas dans vos fichiers de traduction, TypeScript détecte l'erreur au moment de la compilation.

i1n continue de gérer les fichiers de traduction (push, pull, traduction IA) et de générer i1n.d.ts. Votre bibliothèque continue de gérer le chargement à l'exécution, l'interpolation et la pluralisation. Les deux systèmes fonctionnent ensemble de manière transparente.

Quand utiliser le mode pont par rapport au mode autonome

Utilisez le mode Pont (Bridge Mode) lorsque vous avez un projet existant avec une bibliothèque i18n établie et que vous ne souhaitez pas réécrire le code de l'application. Le mode Pont offre un chemin de migration sans coût — vous pouvez adopter l'infrastructure d'i1n sans modifier un seul composant.

Utilisez le mode autonome pour les nouveaux projets ou lorsque vous souhaitez remplacer entièrement votre bibliothèque i18n. Le SDK i1n gère nativement l'initialisation, l'interpolation, la pluralisation et le changement de langue, sans dépendances externes.

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))

Associé

Tableau de bord

Guide du tableau de bord web i1n : création de compte, organisations, clés API, édition de traductions et gestion d'équipe.