AWS Amplify doesn't show i18n translation on dynamic page in Nextjs (page directory)

I am trying to use the next-i18next package in a Nextjs project. In my dynamic pages like: /blogs/[id] section, i18n can't translate the page and only shows its key on the server, but it works fine locally.

this is my code for translation in next-i18next:

export async function getServerSideProps(context) { const { locale, params: { id }} = context; return { props: {...(await serverSideTranslations(locale))}}}

On the server it only shows JSON keys and I can't see any translation. (Just for dynamic pages)

I guess this problem is due to the use of amplify and we need to have some configuration for it.


  • There might be an issue related to resolving the message/local files, as mentioned in the README of next-i18next itself:

    Some serverless PaaS may not be able to locate the path of your translations and require additional configuration.

    Try adding the absolute path of locales by using path.resolve, e.g:


    const path = require('path');
    module.exports = {
        i18n: {
          defaultLocale: 'en',
          locales: ['en', 'cs'],
          localePath: path.resolve('./public/locales')