Next.js

Integra i1n con Next.js usando next-intl o l'SDK di i1n direttamente.

Configurazione

Esegui i1n init nel tuo progetto Next.js. La CLI rileva automaticamente next-intl se presente e configura il formato JSON nidificato nella tua directory locales/.

i1n funziona sia con App Router che con Pages Router. Puoi usare l'SDK di i1n in modalità standalone o collegarlo a next-intl tramite Bridge Mode.

Modalità Autonoma

Importa init e t da i1n, carica le tue risorse di traduzione e usa t() direttamente nei tuoi componenti. Il file i1n.d.ts generato automaticamente fornisce sicurezza completa dei tipi e completamento automatico dell'IDE.

Questo approccio sostituisce completamente next-intl. Usa init() per caricare le risorse e setLocale() per cambiare lingua. Non è necessaria alcuna libreria i18n aggiuntiva.

Modalità bridge con next-intl

Se il tuo progetto utilizza già next-intl, collegalo a i1n con una sola riga: registerI1n((key, params) => nextIntlT(key, params)). Ciò preserva la tua configurazione next-intl esistente aggiungendo l'autocompletamento type-safe di i1n.

i1n gestisce i file di traduzione, la traduzione AI e la generazione di tipi. next-intl continua a gestire il caricamento in fase di runtime, i componenti server e il routing. Ottieni i vantaggi di entrambi i sistemi con costi di migrazione pari a zero.

Distribuzione

Aggiungi i1n pull al tuo passaggio di build o pipeline CI/CD per assicurarti che le traduzioni siano sempre sincronizzate prima del deployment.

La generazione statica (SSG) e il rendering lato server (SSR) di Next.js funzionano perfettamente con i file di traduzione gestiti da i1n.

app/[locale]/page.tsx

import { t } from 'i1n'

export default function HomePage() {
  return (
    <main>
      <h1>{t('home.title')}</h1>
      <p>{t('home.subtitle')}</p>
    </main>
  )
}

Bridge Mode — src/i18n.ts

import { registerI1n } from 'i1n'
import { useTranslations } from 'next-intl'

const t = useTranslations()
registerI1n((key, params) => t(key, params))

Correlato

Cruscotto

Guida alla dashboard web di i1n: creazione account, organizzazioni, chiavi API, modifica traduzioni e gestione del team.

Modalità Bridge

Mantieni la tua libreria i18n esistente aggiungendo l'autocompletamento type-safe, la traduzione AI e la gestione dei file di i1n.