CODEWITHSUNDEEP
javascriptreactjsurlnext.jsi18next
Re-Angelo
Re-Angelo

Reputation: 557

Implementing multiple language url nextjs and next-i18n-next

I"m about to use the next-i18next internalization library.

https://github.com/isaachinman/next-i18next

I was wondering how I can change the language of the path of my url. Something like this:

/about-us

/over-ons -> goes to dutch version of about us page.

Thanks in advance!

Upvotes: 2

Views: 2486

Answers (1)

Mojtaba Moosavi
Mojtaba Moosavi

Reputation: 26

You must set localeSubpaths in your next.config.js

next.config.js

const {nextI18NextRewrites} = require('next-i18next/rewrites');

const localeSubpaths = {
    en: 'en',
    fr: 'fr',
};

module.exports = {
    rewrites: async () => nextI18NextRewrites(localeSubpaths),
    publicRuntimeConfig: {
        localeSubpaths,
    },
};

i18n.js

const NextI18Next = require('next-i18next').default;
const {localeSubpaths} = require('next/config').default().publicRuntimeConfig;
const path = require('path');

module.exports = new NextI18Next({
    defaultLanguage: 'fr',
    otherLanguages: ['en'],
    defaultNS: 'common',
    browserLanguageDetection: false,
    serverLanguageDetection: false,
    localeSubpaths,
    localePath: path.resolve('./public/locales')
});

Upvotes: 1

Related Questions