CODEWITHSUNDEEP
reactjsinternationalizationnext.jsi18nextnext-i18next
Taha A.
Taha A.

Reputation: 208

Next.js next-i18next is always routing to EN

I have a simple project that supposed to work with English and Dutch(default). I have copied everything from the original example but somehow it doesn't work as expected.

Even though I have browserLanguageDetection: false, it is forcing me to /enendpoint.

I would like to show the NL text on / but currently I couldn't.

Could you please check the sandbox and tell me what is wrong here?

https://codesandbox.io/s/pensive-galileo-zifjm?file=/pages/index.js

Upvotes: 1

Views: 1824

Answers (2)

Batu
Batu

Reputation: 31

There is solution in the docs. Here it is: https://nextjs.org/docs/advanced-features/i18n-routing

As I found out from the docs you should declare localeDetection: false then you should declare your own domain paths. It will work.

i18n: {
 defaultLocale: 'en',
 locales: ['en'],
 
 localeDetection: false, // Important!

 domains: [
  {
   domain: 'example.com', // <-
   defaultLocale: 'en' // This locale will be appeared at the exact above domain.
  },
  {
   // 2nd locale goes here in the same way.
  }
 ]
}

I hope, it helps.

Upvotes: 3

enoch
enoch

Reputation: 3123

It is important to know that in Next.js, the first loading is always done on the server side. In i18n.js you have defined browserLanguageDetection: false but you have not defined serverLanguageDetection: false that's why you are always redirected to /en

In the index page, replace this line export default withTranslation('common')(IndexPage); with this one export default withTranslation(['common'])(IndexPage); to avoid this warning

Upvotes: 1

Related Questions