DEV Community

Cover image for next-export-i18n v1.2.1: i18n with Next.js and Mustache
Martin Krause
Martin Krause

Posted on • Edited on

next-export-i18n v1.2.1: i18n with Next.js and Mustache

Today I released version 1.2.1 of next-export-i18n, the i18n module for Next.js which is fully compatible with next export.


Install next-export-i18n with $ npm i next-export-i18n or visit next-export-i18n v1.2.1 from npm.js.


New feature: Dynamic translations + Mustache

Starting with Version 1.2.1, you can now define mustache templates in your translation.json and populate your translated string with dynamic content on the fly.

translation.json

{
    "myTemplate": "{{count}} times",
}
Enter fullscreen mode Exit fullscreen mode

Module.js

    import { useTranslation} from 'next-export-i18n'
    const { t } = useTranslation();
    const key = 'myTemplate';
    let string = t(key, { count: 2 })) // string will be "2 times"
Enter fullscreen mode Exit fullscreen mode

About next-export-i18n

This npm module provides a simple solution for Internationalization (i18n) of projects using next export.

Next.js already has support for internationalized (i18n) routing out-of-the-box. You can provide a list of locales, a default as well as domain-specific locales and Next.js automatically handles the routing. It streamlines the touring and locale parsing for nearly all existing l18n library solutions available for Next.js such as react-intl, react-i18next, lingui, rosetta, next-intl.

Unfortunately, Next.js i18n-routing does not supports next export.
This means that none of the i18n-libraries (which are utilizing the build in i18n-routing) is able to support fully static sites which are generated with next export.

next-export-i18n provides a simple solution for Internationalization (i18n) when you want to generate a truly static website with next export.

Read the Introduction to next-export-i18n for more details.


Sample implementation

You can also take a look at the example implementation next-export-i18n-example.vercel.app and its source code at github: https://github.com/martinkr/next-export-i18n-example.


Links


Follow me on Twitter: @martinkr and consider to buy me a coffee


Photo by Jerry Zhang on Unsplash


Subscribe to the weekly modern frontend development newsletter


Top comments (0)