Hi there, I hope you can help me.
I'm new on vue/i18n and other, so sorry if the response is simple or already exists where else, but I didn't find it ......
Let me explain
I generate a fresh vue project with vue-cli in typescript like this like this
then, I try to add the i18n plugin to this new project with the command 'vue add i18n@next' and select these options
import { createI18n, LocaleMessages, VueMessageType } from 'vue-i18n'
/**
* Load locale messages
*
* The loaded `JSON` locale messages is pre-compiled by `@intlify/vue-i18n-loader`, which is integrated into `vue-cli-plugin-i18n`.
* See: https://github.com/intlify/vue-i18n-loader#rocket-i18n-resource-pre-compilation
*/
function loadLocaleMessages(): LocaleMessages<VueMessageType> {
const locales = require.context('./locales', true, /[A-Za-z0-9-_,\s]+\.json$/i)
const messages: LocaleMessages<VueMessageType> = {}
locales.keys().forEach(key => {
const matched = key.match(/([A-Za-z0-9-_]+)\./i)
if (matched && matched.length > 1) {
const locale = matched[1]
messages[locale] = locales(key)
}
})
return messages
}
export default createI18n({
legacy: false,
locale: process.env.VUE_APP_I18N_LOCALE || 'en',
fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en',
messages: loadLocaleMessages()
})
But finally, when I run an npm run serve command, I have this error
ERROR in src/i18n.ts:26:3
TS2769: No overload matches this call.
Overload 1 of 2, '(options: I18nOptions<{ message: LocaleMessage<VueMessageType>; datetime: DateTimeFormat; number: NumberFormat; }, string, ComposerOptions<{ ...; }, ... 9 more ..., NumberFormats<...>> | VueI18nOptions<...>>, LegacyVueI18n?: any): I18n<...>', gave the following error.
Type 'LocaleMessages<VueMessageType, string, string>' is not assignable to type '{ [x: string]: LocaleMessage<VueMessageType>; }'.
'string' index signatures are incompatible.
Type 'VueMessageType' is not assignable to type 'LocaleMessage<VueMessageType>'.
Type 'string' is not assignable to type 'LocaleMessage<VueMessageType>'.
Overload 2 of 2, '(options: I18nOptions<{ message: LocaleMessage<VueMessageType>; datetime: DateTimeFormat; number: NumberFormat; }, { messages: "en-US"; datetimeFormats: "en-US"; numberFormats: "en-US"; }, ComposerOptions<...> | VueI18nOptions<...>>, LegacyVueI18n?: any): I18n<...>', gave the following error.
Property '"en-US"' is missing in type 'LocaleMessages<VueMessageType, string, string>' but required in type '{ "en-US": LocaleMessage<VueMessageType>; }'.
24 | locale: process.env.VUE_APP_I18N_LOCALE || 'en',
25 | fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en',
> 26 | messages: loadLocaleMessages()
| ^^^^^^^^
27 | })
28 |
Hi there, I hope you can help me. I'm new on vue/i18n and other, so sorry if the response is simple or already exists where else, but I didn't find it ......
Let me explain I generate a fresh vue project with vue-cli in typescript like this like this![my vue3 project config](https://user-images.githubusercontent.com/4711931/210830173-91490589-e972-4e38-ab20-dc6c6753056b.png)
then, I try to add the i18n plugin to this new project with the command 'vue add i18n@next' and select these options![Config i18n@next](https://user-images.githubusercontent.com/4711931/210830609-779118bd-4662-4dfd-bd17-ed2ef8d55181.png)
this is the content of my packagess.json file
And the content of my i18n.ts generated file
But finally, when I run an npm run serve command, I have this error
Thanks for your time and your help.
Florian
node version => v16.17.1 npm version => 8.15.0