Repolode
Submit
i18next

i18next/next-i18next

Translation toolkit for Next.js apps that wires i18next and react-i18next into the App Router, Pages Router, and middleware.

View on GitHubWebsite
Stars
6,166
Forks
756
Open issues
0
Last commit
13 hours ago

What is it?

next-i18next is a layer on top of i18next and react-i18next that handles the Next.js-specific parts of translating an app: proxy/middleware language detection and locale redirects, the split between server and client components, and passing loaded translations from server to client.

It supports the App Router (Server Components, Client Components, proxy), the Pages Router through the next-i18next/pages entry point, and mixed setups where both routers run in one project. Translation files can live in public/locales or be loaded with dynamic imports, which suits serverless deployments. Locale can appear in the URL path, be hidden for the default language, or be stored in a cookie with clean URLs.

Optional support covers ICU MessageFormat and Unicode MessageFormat 2 through plugins, and custom i18next backends such as HTTP, Locize, or chained caching backends can be plugged in.

Key features

  • 01Supports App Router, Pages Router, and mixed-router projects in one codebase.
  • 02Detects language from cookie or Accept-Language and redirects to locale-prefixed paths.
  • 03Loads translations from public files or dynamic imports that work on serverless platforms.
  • 04Serializes loaded resources from server components to client components.
  • 05Offers ICU and MF2 message formats through optional plugins.
  • 06Accepts custom i18next backends such as HTTP and Locize.

Use cases

  • Adding multi-language support to an existing Next.js App Router site.
  • Running localized and non-localized routes side by side in a migration from the Pages Router.
  • Deploying a translated Next.js app to Vercel or other serverless hosts.
  • Loading translations from a CDN or translation management service.

Quick start

  1. 1

    Install the packages

    npm install next-i18next i18next react-i18next
  2. 2

    Create translation JSON files and an i18n config with a resourceLoader

  3. 3

    Add proxy.ts that exports createProxy(i18nConfig)

  4. 4

    Set up the root layout with initServerI18next and I18nProvider

Things to know

  • On serverless platforms, translations must be loaded with resourceLoader because public/ files are not available at runtime.
  • Hot-reloading translations in dev can stall with import()-based loaders and needs a workaround.
  • With cacheComponents enabled, next dev reports uncached data warnings for file-based translation reads.

Topics

#i18n#nextjs#react#i18next#internationalization#ssr#typescript#next#now#react-i18next

FAQ

What is next-i18next?
Translation toolkit for Next.js apps that wires i18next and react-i18next into the App Router, Pages Router, and middleware. next-i18next is a layer on top of i18next and react-i18next that handles the Next.js-specific parts of translating an app: proxy/middleware language detection and locale redirects, the split between server and client components, and passing loaded translations from server to client.
Is next-i18next free to use? What license does it have?
next-i18next is open source under the MIT license. Check the license terms before using it in commercial products.
Is next-i18next still maintained?
Actively maintained. The last commit to next-i18next was on Nov 7, 2026.
What can I use next-i18next for?
Adding multi-language support to an existing Next.js App Router site. Running localized and non-localized routes side by side in a migration from the Pages Router. Deploying a translated Next.js app to Vercel or other serverless hosts. Loading translations from a CDN or translation management service.
How do I install next-i18next?
Install the packages: npm install next-i18next i18next react-i18next Create translation JSON files and an i18n config with a resourceLoader Add proxy.ts that exports createProxy(i18nConfig) Set up the root layout with initServerI18next and I18nProvider
Where can I get next-i18next?
The source code and installation instructions are on GitHub: https://github.com/i18next/next-i18next

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects