Fully-Typed Node-Based i18n Translation Library.
Intl T, International Tree, International Translations, International T Object, Internationalization for TypeScript, International T
- π― Fully-Typed for TypeScript with autocomplete for translation variables
- π² Node-based translations for easy organization and management
- β¨ Type-safe translation keys, values and all sub-nodes
- π Supports JSON files and dynamic remote imports
- πͺ Flexible syntax integrating all the best parts of other i18n libraries
- π§© ICU message format support and extended for complex and nested pluralization and formatting
- βοΈ React components injections out of the box with translation variables
- π Supports server-side rendering and static rendering with Next.js and React
- π Dynamic importing of locales for optimized bundle size and on-demand language loading
- βοΈ Modular and agnostic to any framework or library
- π¦ 4kb Lightweight bundle with no external dependencies and Tree-Shakable
export default function Component() {
const { t } = useTranslation("homepage");
return (
<>
<h1>{t("title")}</h1>
{/* Get translations as an object or function */}
<h2>{t.title}</h2>
{/* Use variables in your translations */}
<span>{t("welcome", { user: "Ivan" })}</span>
<span>{t.summary(data)}</span>
{/* Flexible syntax */}
<p>{t("main", { now: Date.now() })}</p>
<ul>
{/* Array of translations */}
{t.features.map(t => (
<li key={t.id} title={t("title")}>
{t}
</li>
))}
</ul>
<ul>
<li>{t.features[0]}</li>
<li>{t("features.1", { name: "Ivan V" })}</li>
<li>{t("features")[2]({ name: "Ivan V" })}</li>
<li>{t({ name: "Ivan V" }).features("3")}</li>
</ul>
{/* Node-based translations */}
<p>{t.page1.section1.article1.title}</p>
<p>{t("page1/section1").article1("title")}</p>
{/* Full typesafe with completion for variables */}
<p>{t({ day: "Monday" }).account(UserVariables).options.change}</p>
</>
);
}If you find this project useful, consider supporting its development β or leave a β on the Github Repo. Also, if you need direct support or help, please don't hesitate to contact me.