Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

147
Views
How to better organize multiple namespaces using i18next

I have multiple namespaces and multiple different language files, but we might have much more and it's going to be tremendously large, I want to know if there's a simpler or better-organized way. Currently, I import every namespace from every single language, so I import them like so:

// auth
import auth_de from './de/auth.json';
import auth_en from './en/auth.json';
import auth_es from './es/auth.json';
import auth_fr from './fr/auth.json';
import auth_it from './it/auth.json';
import auth_pt from './pt/auth.json';
import auth_zh from './zh/auth.json';
// global
import global_de from './de/global.json';
import global_en from './en/global.json';
import global_es from './es/global.json';
import global_fr from './fr/global.json';
import global_it from './it/global.json';
import global_pt from './pt/global.json';
import global_zh from './zh/global.json';

Then I create the resource file for each language:

const resources = {
  de: {
    auth: auth_de,
    global: global_de,
  },
  en: {
    auth: auth_en,
    global: global_en,
  },
  es: {
    auth: auth_es,
    global: global_es,
  },
  fr: {
    auth: auth_fr,
    global: global_fr,
  },
  it: {
    auth: auth_it,
    global: global_it,
  },
  pt: {
    auth: auth_pt,
    global: global_pt,
  },
  zh: {
    auth: auth_zh,
    global: global_zh,
  },
};

In this example, I have 7 languages and 2 namespaces, but we might have more languages in the future but we'll definitely have more namespaces, I'd guess around 15, so this file is going to be incredibly large, is there any better way to organize it?

about 4 years ago · Santiago Gelvez
1 answers
Answer question

0

Personally, I would lazy load the translations with a backend plugin like i18next-http-backend (or i18next-locize-backend)?

There's a nice react guide that shows how to separate translations from code and lazy load them, here. And the usage on how to use multiple namespaces with react-i18next.

about 4 years ago · Santiago Gelvez Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!