vue-i18n
vue-i18n copied to clipboard
AvailableLocales option is not passed to global instance
Reporting a bug?
AvailableLocales option (via createI18n
) is not passed to the global instance without messages
option.
but createI18n
is accepted availableLocales option by type of VueI18nOptions
.
Is it correct behavior?
Expected behavior
AvailableLocales option is passed to the global instance
Reproduction
Code
import { createI18n } from 'vue-i18n'
{
const i18n = createI18n({
legacy: false,
locale: 'ja',
messages: {
en: { hoge: 'hoge' },
ja: { hoge: 'ほげ' }
}
})
console.log("with messages: " + i18n.global.availableLocales)
}
{
const i18n = createI18n({
legacy: false,
locale: 'ja',
availableLocales: ['en','ja']
})
console.log("without messages: " + i18n.global.availableLocales)
}
Result
"with messages: en,ja"
"without messages: ja"
Link
System Info
System:
OS: Linux 5.10 Ubuntu 22.04 LTS 22.04 LTS (Jammy Jellyfish)
CPU: (8) x64 Intel(R) Core(TM) i7-9700K CPU @ 3.60GHz
Memory: 11.62 GB / 15.60 GB
Container: Yes
Shell: 3.3.1 - /usr/bin/fish
Binaries:
Node: 16.17.0 - ~/n/bin/node
Yarn: 1.22.19 - ~/n/bin/yarn
npm: 8.15.0 - ~/n/bin/npm
Screenshot
No response
Additional context
I wanna use only <i18n></i18n>
block without json
or yaml
language configs.
So I expect that behavior.
Validations
- [X] Read the Contributing Guidelines
- [X] Read the Documentation
- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion
- [X] The provided reproduction is a minimal reproducible example of the bug.
Now I'm using messages
option with an empty object as workaround.
Like as
const i18n = createI18n({
legacy: false,
locale: 'ja',
messages: {
en: {},
ja: {}
}
})
But if createI18n
still accepts availableLocales
option, I guess should fix that behavior.
Thank you for your feedback!
sorry, poor vue-i18n API docs.
availableLocales
API docs is here:
https://vue-i18n.intlify.dev/api/composition.html#composer
availableLocales
is read only, so we can set to it.
availableLocales
calculates valid locale from the locale
option and the messages
option.
So, in your workaround code,
const i18n = createI18n({ legacy: false, locale: 'ja', messages: { en: {}, ja: {} } })
you can use availableLocales
will work correctly.
A reason for which availableLocales
is provided is, for example, a case where you want to load message resources using lazy load.
By using availableLocales
in advance, the difference between the locales supported by the application and the locale from which the message resource is not loaded can be calculated.
We need to improve vue-i18n docs