Configuration
Two modes: one build artifact per language, or a single build that loads languages at runtime.
@mmstack/translatenpm
No need to worry, you can change this pretty easily if you ever change your mind. If you only ever ship one language, the default mode needs no configuration at all and you can skip most of this page.
#One build per language
The default mode behaves like @angular/localize. It reads Angular's LOCALE_ID and expects a page reload to change language, which suits the traditional setup where each locale is its own build served from its own path. No provider from this library is required.
import { ApplicationConfig, LOCALE_ID } from '@angular/core';
export const appConfig: ApplicationConfig = {
providers: [
{ provide: LOCALE_ID, useValue: 'en-US' }, // set your locale
// ...other providers
],
};#One build, languages at runtime
provideIntlConfig() loads translations at runtime, so a single build serves every locale and the language can change without a reload. Name the default locale and list the ones you support. Reach for this when you want a language picker or a locale segment in the URL.
import { ApplicationConfig, LOCALE_ID } from '@angular/core';
import { provideIntlConfig } from '@mmstack/translate';
export const appConfig: ApplicationConfig = {
providers: [
provideIntlConfig({
defaultLocale: 'en-US',
supportedLocales: ['en-US', 'sl-SI', 'de-DE', 'fr-FR'],
}),
// ...other providers
],
};supportedLocales is the allowlist. A switch to a locale that is not on it is a no-op, so you cannot land in an unsupported state.
#Options
Beyond the two required keys, provideIntlConfig takes a few optional ones:
| Option | What it does |
|---|---|
localeParamName | Drives the active locale from a route parameter. |
localeStorage | Persists a user-picked locale across reloads. Mutually exclusive with localeParamName, since the URL would only fight it. |
preloadDefaultLocale | Eagerly loads the default bundle so it is available as a synchronous fallback. |
releaseCachedSignals | Holds cached translation signals weakly so they can be collected once the component that read them is destroyed. Off by default, since translation keys are a bounded set for most apps. Turn it on only for large apps under measured memory pressure, or ones that build keys dynamically. |
The runtime switching side, including injectDynamicLocale and a language switcher, lives on the Reading translations page. To read the resolved configuration back, injectDefaultLocale() returns the active default and injectSupportedLocales() returns the allowlist (falling back to the default when none was set), which is handy for building a language picker from one source of truth.