Internationalisation

`i18n/explicit-locale`

Intl formatters and toLocale*String() receive the app's active locale instead of relying on the runtime default.

minorstaticfe-i18n

Why

Without a locale, formatting follows the browser or server default. A Polish page then shows English dates to a visitor with an English browser, and server rendering (often en-US in a container) produces text that differs from the client, which causes hydration mismatches.

Fix

Pass the locale the app uses for its messages (from the router, the i18n library or <html lang>), and set timeZone explicitly when rendering dates on the server.

Examples

// bad
date.toLocaleDateString()
// good
date.toLocaleDateString(locale, { dateStyle: 'long', timeZone })

Sources

Facts

Id: i18n/explicit-locale
Severity: minor
Check: static checked in the source by audit
Applies to: jsx vue svelte astro html
Taught by the skill: fe-i18n Internationalisation
Since version: 0.1.0

Rule file on GitHub

Read it in the terminal

npx github:dawidolko/frontend-skills explain i18n/explicit-locale