bounty将在7天后过期。回答此问题可获得+50的声望奖励。baitendbidz正在寻找标准答案。

为了再现的目的，我将试着描述一下我所做的事情：

• 根据Vuetify安装文档，我通过npm create vuetify创建了一个新项目
• 根据Vuetify i18 n文档，我安装了vue-i18n包，并将插件设置更改为

。

import { createVuetify } from 'vuetify'
import { createVueI18nAdapter } from 'vuetify/locale/adapters/vue-i18n'
import { createI18n, useI18n } from 'vue-i18n'

const messages = { en: { title: "title | en" }, de: { title: "Titel | de" }}

const i18n = new createI18n({
  legacy: false,
  locale: 'en',
  fallbackLocale: 'en',
  messages,
})

export default createVuetify({
  locale: {
    adapter: createVueI18nAdapter({ i18n, useI18n })
  }
})

• 出于测试目的，我将 App.vue 的内容更改为

。

<script setup lang="ts">
import { useLocale } from 'vuetify'

const { t, current } = useLocale()

setTimeout(() => {
  current.value = 'de';
}, 3000);
</script>

<template>
  <div>
    <div>content:</div>
    <div>{{ t('title') }}</div>
  </div>
</template>

这和预期的一样有效！

• 我不想像vue-i18 n文档中描述的那样在一个大对象中管理消息，而是将它们移动到它们的组件中。我从i18n变量中完全删除了messages字段（因为我不再需要messages对象），并将以下内容添加到 App.vue 中

。

<i18n>
  {
    "en": {
      "title": "title | en"
    },
    "de": {
      "title": "Titel | de"
    }
  }
</i18n>

• 由于这不工作的方块，我安装了包@intlify/unplugin-vue-i18n从这些文档，更新包@vitejs/plugin-vue到版本3.2.0.和修改 vite.config.ts 文件使用插件

。

VueI18nPlugin({
  include: resolve(dirname(fileURLToPath(import.meta.url)), './src/**'),
}),

不幸的是，我不知道正确的路径使用...目前应用程序不呈现消息

有人知道出了什么问题或丢失了什么吗？