I'm trying to setup localisation for an existing app. I've gotten fairly far. But something is not quite right.

My setup is having multiple translation calls in the files like so: {attribute: 'stress', text: t('dass21::I found it hard to wind down')},

As you can see, I changed the namespace separator to be a double :: since I have a lot of medical specific sentences which are hard to think keys for, so the actual sentence is the key.

To export the translation into json translations files I use: i18next 'src/**/*.js' which works fine. It makes a folder for every language, and in that folder, for every namespace it makes a file. (Eg in this case, it will make a file dass21.json).

My configuration for the i18next-parser is:

module.exports = {
  // Since keys hold regular english I can't have the default settings
  namespaceSeparator: '::',
  keySeparator: '_',
  pluralSeparator: "|",

  locales: ['en', 'es'],

  output: 'assets/locales/$LOCALE/$NAMESPACE.json',
}

I matches those settings in the i18next init like so:

import i18next from "i18next";

import HttpApi from 'i18next-http-backend';

i18next
.use(HttpApi)
.init({
  backend: {
    // for all available options read the backend's repository readme file
    loadPath: '/assessments/locales/{{lng}}/{{ns}}.json',
  },

  fallbackLng: 'en',
  lng: 'en',
  supportedLngs: ['en', 'es'],

  namespaceSeparator: '::',
  keySeparator: '_',
  pluralSeparator: "|",
});

const t = i18next.t

export default t

As you can see, I want to load my translation files over http (which are served by a node server and this works). However, it only tries to load a generic translation file called translation.js and none of my specific namespace files. Even though the call to t with dass21::I found it hard to wind down is called. (Since it is visible on the screen using its key).

How can I make sure it also tries to load the namespace specific files over http, while having the custom namespace separators?