Having trouble migrating from react-i18next to next-i18next

[josephkabba]

Hey here, I have a project I am moving from react to next. My problem is that I have my translation logic working well with react-i18next. I am moving over to next-i18next but the documentation surrounding the customization of the ".public/locale/en/common.json" files is insufficient. I am left asking myself if the file structure can be modified into something like this "./src/localization/en/common.ts"

This is my "next-i18next.config.js" file:

const paths = require("path");
const { translation } = require('./src/localization/en/common');
/** @type {import('next-i18next').UserConfig} */

module.exports = {
  i18n: {
    defaultLocale: 'en',
    locales: ['en', 'de'],
  },
  localePath:
    typeof window === 'undefined'
      ? paths.resolve('./src/localization')
      : '/src/localization',
  localeExtension: 'ts',
  localeStructure: '{{lng}}/{{ns}}',
  ns: ['common'],
  defaultNS: 'common',
  interpolation: {
    escapeValue: false,
  },
  react: {
    useSuspense: false,
  },
  resources: {
    en: {
      common: translation,
    },
  },
}

[adrai]

No it's not possible to automatically use the ts files, but with v15.2.0 you can do something like this:

const { translation: translationEn } = require('./src/localization/en/common');
const { translation: translationDe } = require('./src/localization/de/common');
/** @type {import('next-i18next').UserConfig} */

module.exports = {
  i18n: {
    defaultLocale: 'en',
    locales: ['en', 'de'],
  },
  localePath: true,
  ns: ['common'],
  defaultNS: 'common',
  interpolation: {
    escapeValue: false,
  },
  react: {
    useSuspense: false,
  },
  resources: {
    en: {
      common: translationEn,
    },
    de: {
      common: translationDe,
    },
  },
}

[josephkabba]

Thanks this worked.