Message Loading

Message loading in Intor is explicitly structured to accommodate different application types and deployment requirements.

There are two primary loading approaches:

• Bundled : Included in the application bundle.
• Loader : Loaded at runtime for more flexible scenarios.

Bundled

Translation content is bundled into the application during the build process.

This includes defining content directly in the config (static import) or loading content per locale (dynamic import).

This approach is suitable for hosted platforms (such as Vercel) and pure frontend applications.

Config-defined Messages (Static Import)

Translation content is defined directly in the configuration file,
which is suitable when the content is stable and relatively small in scale.

import { defineIntorConfig } from "intor";
import EN from "../../messages/en/index.json";
import FR from "../../messages/fr/index.json";

export const intorConfig = defineIntorConfig({
  defaultLocale: "en",
  supportedLocales: ["en", "fr"],
  messages: {
    en: EN,
    fr: FR,
  },
});

Per-locale Loading (Dynamic Import)

When translation content grows in size or needs to be split by locale, you can load the corresponding content per locale using import().

This approach requires providing a loadMessages function. Below is a basic implementation:

load-messages.ts
import type { IntorResolvedConfig, LocaleMessages } from "intor";
import { mergeMessages } from "intor";

export async function loadMessages(
  config: IntorResolvedConfig,
  locale: string,
): Promise<LocaleMessages> {
  // Adjust the import path based on your project structure.
  const loaded: LocaleMessages = {
    [locale]: (await import(`../../messages/${locale}/index.json`)).default,
  };
  return mergeMessages(config.messages, loaded, { config, locale });
}

Integration details vary by runtime environment. See: Frameworks

When using server-side routing frameworks, routing.forceFullReload must be enabled.

Loader

Translation content is loaded at runtime.
Suitable for applications that require greater flexibility.

Loader
Learn more about Loader

Comparison