npm i @intlify/unplugin-vue-i18n vue-i18n

import { resolve, dirname } from 'node:path'
import { fileURLToPath } from 'url'
import VueI18nVitePlugin from '@intlify/unplugin-vue-i18n/vite'

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  build: {
  transpile: [/vue-i18n/]
},
  vite: {
    resolve: {
      alias: {
        'vue-i18n': 'vue-i18n/dist/vue-i18n.runtime.esm-bundler.js'
      }
    },
    plugins: [
      VueI18nVitePlugin({
        include: [
          resolve(dirname(fileURLToPath(import.meta.url)), './locales/*.json')
        ]
      })
    ]
  }
})

|- plugins
    |-- i18n.ts
|- i18n
    |-- zh.ts
    |-- en.ts

export default {
  home: 'Дом',
}

import { createI18n } from 'vue-i18n'
import en from '../i18n/en'
import zh from '../i18n/zh'

export default defineNuxtPlugin(({ vueApp }) => {
    // Здесь по умолчанию установлено получение языковой конфигурации из файла cookie при запуске. Что касается того, почему файлы cookie , потому что следующий Причина загрузки сервера первого экрана
  const language = useCookie('lang').value || 'en'
  const i18n = createI18n({
    fallbackLocale: 'zh',
    locale: language,
    messages: {
      zh,
      en
    }
  })

  vueApp.use(i18n)
})

<template>
  <div>
    <select v-model="$i18n.locale" @change="handleChange">
      <option value="zh">китайский</option>
      <option value="en">English</option>
    </select>
  </div>
</template>

<script setup lang="ts">
import { useI18n } from 'vue-i18n'

const { locale } = useI18n()
const handleChange = () => {
  const cookieLang = useCookie('lang')
  cookieLang.value = locale.value
}
</script>

<style lang="scss" scoped></style>

<template>
  <div>
        <NuxtLink to="/home" active-class="active">
          {{ $t('home') }}
        </NuxtLink>
  </div>
</template>