Today we are going to fix the common error that may occur when implementing i18n in our React environment with Next.js.
This is the error:
Unhandled Runtime Error Error: Text content does not match server-rendered HTML. Warning: Text content did not match. Server: "" Client: "" See more info here: https://nextjs.org/docs/messages/react-hydration-error
Returns only the HTML translated, without any addition.
This is usually because we are importing the i18n library incorrectly (the useTranslation component). To fix this, let’s check if we have mistakenly imported it:
import { useTranslation } from 'react-i18next';
Returns only the HTML translated, without any addition.
import { useTranslation } from 'next-i18next';
The problem should be solved.
