i18next / next-app-dir-i18next-example

Next.js 13/14 app directory feature in combination with i18next
https://locize.com/blog/next-app-dir-i18n/
175 stars 36 forks source link

Error: Text content did not match #18

Closed yura-brd closed 1 year ago

yura-brd commented 1 year ago

🐛 Bug Report

nextJs 13.4 (App Router). Installed i18next according to instructions https://locize.com/blog/next-13-app-dir-i18n/. The problem is that in the client components (use client), the default language (most likely) comes first, then the selected language is already connected, which leads to a content mismatch problem on the server and client (Text content did not match.). However, the problem does not always appear.

To Reproduce

An example to reproduce. Select another (Russian) language, refresh the page codesandbox

Environment

adrai commented 1 year ago

Have you tried with the preload option? https://github.com/i18next/next-13-app-dir-i18next-example/blob/828be4aa226491fb8d8757fc4d524f8603cca3b9/app/i18n/client.js#L25

yura-brd commented 1 year ago

Thanks. That solved the problem