# next-i18next-ext

> Next integration with i18next

Latest version **0.3.2** (published 2026-02-09) · UNLICENSED license · 0 weekly downloads

## Install

```sh
npm install next-i18next-ext
pnpm add next-i18next-ext
yarn add next-i18next-ext
bun add next-i18next-ext
```

## Health

**Score 55/100 (C)** — status: stable.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

## Facts

| | |
|---|---|
| Version | 0.3.2 |
| Published | 2026-02-09 |
| First published | 2022-10-02 |
| Weekly downloads | 0 |
| License | UNLICENSED |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 22.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Roman Samoylov |
| Maintainers | fakundo |
| Keywords | next, i18next, next-i18next, next-i18next-ext, i18n, internationalization |

## Links

- npm: https://www.npmjs.com/package/next-i18next-ext
- Repository: https://github.com/fakundo/next-i18next-ext
- Homepage: https://github.com/fakundo/next-i18next-ext#readme
- Issues: https://github.com/fakundo/next-i18next-ext/issues
- npm.io page: https://npm.io/package/next-i18next-ext

## Dependencies (1)

- [next-i18next](https://npm.io/package/next-i18next.md) ^12.1.0

## Alternatives

- [messageformat](https://npm.io/package/messageformat.md) — 329.7K weekly downloads
- [@mintlify/scraping](https://npm.io/package/@mintlify/scraping.md) — 294.8K weekly downloads
- [@mintlify/previewing](https://npm.io/package/@mintlify/previewing.md) — 209.5K weekly downloads
- [@mintlify/prebuild](https://npm.io/package/@mintlify/prebuild.md) — 209.5K weekly downloads
- [@mintlify/link-rot](https://npm.io/package/@mintlify/link-rot.md) — 206.3K weekly downloads

## Recent versions

- 0.3.2 (latest) — 2026-02-09
- 0.3.1 — 2026-02-09
- 0.3.0 — 2026-02-09
- 0.2.2 — 2024-04-27
- 0.2.1 — 2024-04-26
- 0.2.0 — 2023-07-20
- 0.1.1 — 2022-10-19
- 0.1.0 — 2022-10-12
- 0.0.10 — 2022-10-03
- 0.0.9 — 2022-10-03
- 0.0.8 — 2022-10-03
- 0.0.7 — 2022-10-02
- 0.0.6 — 2022-10-02
- 0.0.5 — 2022-10-02
- 0.0.4 — 2022-10-02
- … 3 more at https://npm.io/package/next-i18next-ext/versions

## README

# next-i18next-ext

[![npm](https://img.shields.io/npm/v/next-i18next-ext.svg)](https://www.npmjs.com/package/next-i18next-ext)

Extended [next-i18next](https://github.com/i18next/next-i18next) which allows you to use translations shared between pages and load them once. SSG and SSR work great too.

## Installation
  
```
npm i next-i18next-ext
```

## Usage

1. Configure your [custom Document](https://nextjs.org/docs/advanced-features/custom-document) to provide shared translations for the App

```js
import { createGetInitialProps } from 'next-i18next-ext/server';

export default class _Document extends Document {
  static getInitialProps = createGetInitialProps(['common']);

  render() {
    ...
  }
}
```


### Steps above are the same as for `next-i18next`


2. Configure your [custom App](https://nextjs.org/docs/advanced-features/custom-app)

```js
import { appWithTranslation } from 'next-i18next-ext';

const _App = ({ Component, pageProps }) => {
  return <Component {...pageProps} />;
};

export default appWithTranslation(_App);
```

3. You also able to use page-level translations

```js
import { serverSideTranslations } from 'next-i18next-ext/server';

export const getStaticProps = async ({ locale }) => {
  return {
    props: {
      ...(await serverSideTranslations(locale, ['main-page'])),
    },
  };
};
```

4. Use translation

```js
import { useTranslation } from 'react-i18next';

export const Footer = () => {
  const { t } = useTranslation('common');
  return (
    <footer>
      {t('description')}
    </footer>
  );
};
```

## API

#### createGetInitialProps

```ts
const createGetInitialProps: (namespacesRequired?: string[], configOverride?: UserConfig | null, extraLocales?: string[] | false) => (ctx: DocumentContext, locale?: string) => DocumentInitialProps;
```

#### serverSideProps

```ts
const serverSideTranslations: (initialLocale: string, namespacesRequired?: string[] | undefined, configOverride?: UserConfig | null, extraLocales?: string[] | false) => Promise<SSRConfig>;
```

#### appWithTranslation

```ts
const appWithTranslation: (App: any, configOverride?: UserConfig | null) => (appProps: any) => JSX.Element;
```

---
_Source: https://npm.io/package/next-i18next-ext · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._