Single file component for Vue 3 + Vuetify 3 + i18n

[PavelTurk]

I want to have my locale messages separately for every component. I found an example how to do it for Vue 2, but I can't find how to do it for Vue 3 and Vuetify 3. This is what I've done:

package.json

  "dependencies": {
    "@mdi/font": "5.9.55",
    "core-js": "^3.8.3",
    "roboto-fontface": "*",
    "vue": "^3.2.13",
    "vue-class-component": "^8.0.0-0",
    "vue-i18n": "^9.1.2",
    "vuetify": "^3.0.0-alpha.0",
    "webfontloader": "^1.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.12.16",
    "@babel/eslint-parser": "^7.12.16",
    "@intlify/vue-i18n-loader": "^4.1.0",
    "@types/webfontloader": "^1.0.0",
    "@typescript-eslint/eslint-plugin": "^5.4.0",
    "@typescript-eslint/parser": "^5.4.0",
    "@vue/cli-plugin-babel": "~5.0.0-rc.1",
    "@vue/cli-plugin-eslint": "~5.0.0-rc.1",
    "@vue/cli-plugin-typescript": "~5.0.0-rc.1",
    "@vue/cli-service": "~5.0.0-rc.1",
    "@vue/eslint-config-typescript": "^9.1.0",
    "eslint": "^7.32.0",
    "eslint-plugin-vue": "^8.0.3",
    "sass": "^1.38.0",
    "sass-loader": "^10.0.0",
    "typescript": "~4.1.5",
    "vue-cli-plugin-vue-i18n": "~1.0.1",
    "vue-cli-plugin-vuetify": "~2.4.5",
    "vuetify-loader": "^2.0.0-alpha.0"
  },

main.ts:

import { createApp } from 'vue'
import App from './App.vue'
import vuetify from './plugins/vuetify'
import { loadFonts } from './plugins/webfontloader'
import installI18n from './lang/index'
import { createI18n } from 'vue-i18n'

loadFonts()

const app = createApp(App)
installI18n(app)

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

app
  .use(i18n)
  .use(vuetify)
  .mount('#app')

component.vue:

<template>
  <v-card-actions>
    <v-tooltip left>
      <template v-slot:activator="{ props }">
        <v-btn v-bind="props">
          <v-icon size="25">mdi-home</v-icon>
        </v-btn>
      </template>
      <span>{{ $t('hello') }}</span>
    </v-tooltip>
  </v-card-actions>
</template>

<i18n>
{
  "en": {
    "hello": "Hello, world!"
  },
  "ru": {
    "hello": "Привет, мир"
  }
}
</i18n>

However, I still can't make it work. Full test project is available in github. The question was also asked in SO. Could anyone help me?