How make vue-i18n works with vue 3?

Question

I just install vue-i18n with Vue 3 I got error;

my code in app.js file

import { createApp } from 'vue';
// ......
import en from './translate/en.json'
import ar from './translate/ar.json'
import ku from './translate/ku.json'
import { createI18n } from "vue-i18n";

const i18n = createI18n({
    locale: 'ar',
    messages: {
        en,
        ar,
        ku,
    }
})

const el = document.getElementById('app');

const app = createApp(App);
app.use(i18n);
app.mount(el);

The error:

WARNING in ./js/app.js 13:11-21
export 'createI18n' (imported as 'createI18n') was not found in 'vue-i18n' (possible exports:            default)
webpack compiled with 1 warning

In console:

Uncaught TypeError: vue_i18n__WEBPACK_IMPORTED_MODULE_7__.createI18n is not a function

package.json

"dependencies": {
    "tiny-emitter": "^2.1.0",
    "vue-i18n": "^8.24.3"
}

Answer 1

You should install the latest version using the following command :

npm uninstall vue-i18n

then

npm i vue-i18n@next

because [email protected] is compatible with vue 3