Custom message loading

Use this when you need custom logic or another source for messages. Requires familiarity with the tutorial’s JSON files and setRequestLocale. For small local files, keep messages.

Register a loader

This example uses the tutorial’s JSON files. defineRequestConfig registers the function; merely creating the file does not execute it. Import it before initializing the language to activate the loader.

src/i18n/request.ts

import { defineRequestConfig } from "astro-intl";
import en from "./messages/en.json";
import es from "./messages/es.json";

const messages = { en, es };

export default defineRequestConfig(async (locale) => {
  if (locale !== "en" && locale !== "es") {
    throw new Error("Unsupported locale: " + locale);
  }
  return { locale, messages: messages[locale] };
});

Use it in a static page

Keep locales and defaultLocale in the integration and remove messages and its imports from astro.config.mjs when adopting this approach. An explicit loader takes precedence over messages; avoid keeping two configuration sources.

src/pages/[lang]/index.astro

---
import "../../i18n/request";
import { setRequestLocale, getTranslations } from "astro-intl";

export function getStaticPaths() {
  return [{ params: { lang: "en" } }, { params: { lang: "es" } }];
}

await setRequestLocale(Astro.url);
const t = getTranslations();
---

<h1>{t("greeting")}</h1>