Native Translations

RULES:

• import: updateTranslations, changeLang
• base language is JS/TS file (not JSON)
• JSON files live in public/translations
• call updateTranslations() before render (await)
• use changeLang(code, reload) to switch

BASE STRINGS (JS/TS):

import { W } from "winnetoujs";

export default W.strings = {
  appTitle: "My App",
  home: "Home",
  buttonText: "Change Language",
};

INIT:

import { updateTranslations } from "winnetoujs/modules/translations";
import strings from "./translations/en-us";

await updateTranslations({
  stringsClass: strings,
  translationsPublicPath: "/translations",
});
startApp();

JSON (public/translations/pt-br.json):

{
  "appTitle": "Meu App",
  "home": "Início",
  "buttonText": "Mudar Idioma"
}

USE IN CONSTRUCTO:

new $header({ title: strings.appTitle }).create("#app");

CHANGE LANGUAGE:

import { changeLang } from "winnetoujs/modules/translations";

changeLang("pt-br", true); // reload

NO RELOAD (manual re-render):

await changeLang("pt-br", false);
renderApp();

BEST PRACTICES:

• keep keys consistent across JSON files
• group strings by feature for large apps
• avoid hardcoded UI strings

TROUBLESHOOT:

• not loading: check translationsPublicPath and JSON location
• not updating: use reload or re-render
• base not working: export W.strings and await updateTranslations()

Converted and distributed by TomeVault — claim your Tome and manage your conversions.