I18n
Messages
Display text from i18n messages.
Basic usage
Inside getTranslations or useTranslations pass the namespace of the message.
import { getTranslations } from "next-intl/server";
export const ExampleComponent = async () => {
const t = await getTranslations("welcome.home");
return <div>{t("hello")}</div>;
};import { useTranslations } from "next-intl";
export const ExampleComponent = () => {
const t = useTranslations("welcome.home");
return <div>{t("hello")}</div>;
};Example of usage
Dynamic values
"message": "Hello {name}!"t("message", { name: "Jane" }); // "Hello Jane!"Pluralization
"message": "You have {count, plural, one {# message} other {# messages}}"t("message", { count: 1 }); // "You have 1 message"
t("message", { count: 2 }); // "You have 2 messages"Rich text
{
"message": "Please refer to <guidelines>the guidelines</guidelines>."
}// Returns `<>Please refer to <a href="/guidelines">the guidelines</a>.</>`
t.rich("message", {
guidelines: (chunks) => <a href="/guidelines">{chunks}</a>
});next-intl Docs
For more information, check the next-intl documentation.