React-Trad by VogzCorp
Here are all the module installation instructions. Any information from this leaked README.md document is deprecated.
-
To install the module, you must have a javascript or typescript project configured with npm. If this is the case, then you will need to drag the root of this project (
vogzcorp-react-trad) into thenode-modulesfolder -
You must then initialize the translation buttons in a React flip tag as above:
import useTranslate from "vogzcorp-react-trad/src/vogzcorp-trad"
import LangMenu from "vogzcorp-react-trad/src/langMenu"
//instead of a constant, you can use a default import from a json file with the same structure as below
//You can already download example json files on https://vogzcorp.fr/pages/entreprises/vogzcorpdev/modules/react-trad/json/exemple/download
const data = {
en: {
main: {
header: {
content: {
h1: "this is an h1 content"
}
}
}
},
fr: {
main: {
header: {
content: {
h1: "ceci est un contenu h1"
}
}
}
}
}
export function Header() {
const changelang = new useTranslate(data, document.querySelector("html")?.lang)
//about the t() function, ⚠️ be careful, your path argument must contain at least 4 elements like opposite `t("main/header/content/h1")`
return (
<h1>{changelang.t("main/header/content/h1")}</h1> //if the value of html lang argument is "fr", the content of this balise is in french.
<LangMenu />
)
}