Framework7 v6 with Vue3 and vue i18n v9

#1

Hi, I’m using

Here my Sandbox: blissful-framework-6v94k3 - CodeSandbox
Basically, I’m trying to implement an internationalization system but the i18n module doesn’t seem to be loaded.

In my app.js I’ve used:

import { createApp } from 'vue';
import { createI18n } from 'vue-i18n';

const message = {
    en: {
        message: {
            hello: 'hello world'
        }
    }
}
    
const i18n = createI18n({
    locale: 'en',
    fallbackLocale: 'en',
    message
})

....

// Init App
const app = createApp(App);

// Use i18n
app.use(i18n);

But if I try to use {{ $t("message.hello") }} in my Home.vue the string is not rendered.
In the sandbox is possible to try the full code.

What am i doing wrong? Thanks

#2

Up
@nolimits4web could you check this out, please?

#3

It is not related to Framework7, probably your usage is wrong, but it doesn’t work even without F7 relaxed-roentgen-7n4q4z - CodeSandbox

#4

Well…
After freaking out for three days… I discovered that the error was messageS, the s was missing.
I want to die :exploding_head:

const messages = {
    en: {
        message: {
            hello: 'hello world'
        }
    }
}
1 Like