如何通过vue中的vue-i18n使用每种语言的多个文件？

npm install vue-i18n

{
"message": {
"hello": "hello world"
}
}

{
"message": {
"hello": "bonjour le monde"
}
}

import { createApp } from 'vue';
import App from './App.vue';
import { createI18n } from 'vue-i18n';

const i18n = createI18n({
locale: 'en', // 设置默认语言
fallbackLocale: 'en', // 设置备用语言
messages: {
en: require('./locales/en.json'), // 加载英语文件
fr: require('./locales/fr.json') // 加载法语文件
}
});

const app = createApp(App);

app.use(i18n);

app.mount('#app');

<template>
<div>{{ $t('message.hello') }}</div>
</template>

this.$i18n.locale = 'fr'; // 切换到法语

const loadLanguageAsync = async (lang) => {
if (i18n.global.availableLocales.includes(lang)) {
await i18n.global.loadLanguageAsync(lang);
this.$i18n.locale = lang;
} else {
console.error(`Language ${lang} is not supported.`);
}
};

// 使用方法
loadLanguageAsync('fr');