vue3 i18n国际化，普通js，ts文件中的设置方法

在Vue 3项目中使用Vue I18n进行国际化，你需要先安装Vue I18n插件，然后在你的Vue应用中设置它。以下是如何在Vue 3中设置Vue I18n的基本步骤：

1. 安装Vue I18n：

npm install vue-i18n@next

2. 创建一个i18n实例并配置你的语言文件：

// i18n.js
import { createI18n } from 'vue-i18n';
 
const messages = {
  en: {
    message: {
      hello: 'hello'
    }
  },
  fr: {
    message: {
      hello: 'bonjour'
    }
  }
};
 
const i18n = createI18n({
  locale: 'en', // set default locale
  fallbackLocale: 'en', // set fallback locale
  messages, // set locale messages
});
 
export default i18n;

3. 在你的Vue应用中引入并使用i18n实例：

// main.js
import { createApp } from 'vue';
import App from './App.vue';
import i18n from './i18n';
 
const app = createApp(App);
 
app.use(i18n);
 
app.mount('#app');

4. 在你的Vue组件中使用$t函数来国际化你的文本：

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

5. 在普通的JS或TS文件中，你可以使用useI18n函数来访问t函数：

import { useI18n } from 'vue-i18n';
 
export function someFunction() {
  const { t } = useI18n();
  console.log(t('message.hello'));
}

确保你的Vue 3项目配置正确，并且按照Vue I18n的版本要求来设置。上述步骤提供了一个简洁的指南来在Vue 3项目中设置Vue I18n，并在组件和普通JS/TS文件中使用它。