i18n: keep the page's locale in a vue-i18n instance

The application views install one vue-i18n instance that holds the active
locale and the catalogs. src/i18n/index.js stays free of Vue: bindLocale()
keeps its locale in the instance's ref, so t(), tn() and the Intl formatters
read it from there and a view that translates while rendering renders again
when the locale changes. A tag written straight to the ref is normalized.
Message formatting, catalogs and call sites are unchanged, and switching
language still reloads the page.

The instance outlives the views: unmounting one no longer disposes it. The
browser build defines vue-i18n's feature flags and drops its message
compiler, which Core does not use.
This commit is contained in:
Sameh Khamis committed 2026-11-01 15:25:55 -08:00
1 parent 22d4cf8ee7
commit 2c72a038d5
12 files changed
+330 -44

No files matched your search

+84 -1
View File
@@ -21,7 +21,8 @@
"pbf": "^5.1.2",
"pinia": "^2.3.1",
"satellite.js": "^6.0.2",
"vue": "^3.5.44"
"vue": "^3.5.44",
"vue-i18n": "^11.4.15"
},
"devDependencies": {
"@happy-dom/global-registrator": "^20.14.6",
@@ -1130,6 +1131,67 @@
"url": "https://opencollective.com/libvips"
}
},
"node_modules/@intlify/core-base": {
"version": "11.4.15",
"resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-11.4.15.tgz",
"integrity": "sha512-yHNg7+M6VKQuj+KUO/CrtcBMm3iAspvfFe1H/eKI0TP0pn2T2srBF1gEb/TL3c8RA/BZZGOIySwtZD0i+9/hhw==",
"license": "MIT",
"dependencies": {
"@intlify/devtools-types": "11.4.15",
"@intlify/message-compiler": "11.4.15",
"@intlify/shared": "11.4.15"
},
"engines": {
"node": ">= 22"
},
"funding": {
"url": "https://github.com/sponsors/kazupon"
}
},
"node_modules/@intlify/devtools-types": {
"version": "11.4.15",
"resolved": "https://registry.npmjs.org/@intlify/devtools-types/-/devtools-types-11.4.15.tgz",
"integrity": "sha512-NFV9LsP720IkR6BHNfUYBSkd/abocWimcOWAS63D3spwczy8zDvXCf9WMyhCVQ7FcYkWyECZke18x8D6UNVBFw==",
"license": "MIT",
"dependencies": {
"@intlify/core-base": "11.4.15",
"@intlify/shared": "11.4.15"
},
"engines": {
"node": ">= 22"
},
"funding": {
"url": "https://github.com/sponsors/kazupon"
}
},
"node_modules/@intlify/message-compiler": {
"version": "11.4.15",
"resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-11.4.15.tgz",
"integrity": "sha512-dV6apms3MXAG3jZ/6bAq+IW2IKDGasmjA/Aoi0JVKCStVi6GbzrPruCVbU/Djn1n41w5EiM3KdnpTuo6I1qe5w==",
"license": "MIT",
"dependencies": {
"@intlify/shared": "11.4.15",
"source-map-js": "^1.0.2"
},
"engines": {
"node": ">= 22"
},
"funding": {
"url": "https://github.com/sponsors/kazupon"
}
},
"node_modules/@intlify/shared": {
"version": "11.4.15",
"resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-11.4.15.tgz",
"integrity": "sha512-jlTJkM4bMdr267e1iUE2RMNz1LyoYU6IPReKjnQM6RvipEBUVwmMHbeUckDcOmR+WeungEGjaNmSQJdQzJcOfQ==",
"license": "MIT",
"engines": {
"node": ">= 22"
},
"funding": {
"url": "https://github.com/sponsors/kazupon"
}
},
"node_modules/@jridgewell/sourcemap-codec": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.6.0.tgz",
@@ -3700,6 +3762,27 @@
}
}
},
"node_modules/vue-i18n": {
"version": "11.4.15",
"resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-11.4.15.tgz",
"integrity": "sha512-bOoNYoEd/ta4g2EelI9HKxPyMZvTDFoykTNYujDTOGoKDRy5ehKJg8WmMDU7hWqNM5efO7fEGNRuwrBXnwHyDg==",
"license": "MIT",
"dependencies": {
"@intlify/core-base": "11.4.15",
"@intlify/devtools-types": "11.4.15",
"@intlify/shared": "11.4.15",
"@vue/devtools-api": "^6.5.0"
},
"engines": {
"node": ">= 22"
},
"funding": {
"url": "https://github.com/sponsors/kazupon"
},
"peerDependencies": {
"vue": "^3.0.0"
}
},
"node_modules/web-worker": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/web-worker/-/web-worker-1.5.0.tgz",