Vue-i18n arrays: Property does not exist on type 'never

[DarkLite1]

Reporting a bug?

We created a simple landing page that displays countries defined in a Vue-i18n language.json file. This works fine but we get the following TypeScript errors:

[vue-tsc] Property 'code' does not exist on type 'never'.

[vue-tsc] Property 'name' does not exist on type 'never'.

It seems like the properties of a country are not found in the .json file. Although we did define the MessageSchema to be enUS, as described in the official documentation. For other strings in the lang.json files, there are no errors, only with a list or array it does not seem to default to String.

Please find a CodeSandBox for testing here. Below you can find the most important files.

File 'en-US.json'

 "page": {
    "landing": {
      "title": { "selectCountry": "Select your country" },
      "countries": [
        { "code": "BEL", "name": "Belgium" },
        { "code": "NLD", "name": "The Netherlands" }
      ]
    },

File '/boot/i18n.ts'

import enUS from 'src/i18n/en-US.json'
import nlBE from 'src/i18n/nl-BE.json'

export default boot(({ app }) => {
  // Type-define 'enUS' as the master schema for the resource
  type MessageSchema = typeof enUS

  const i18n = createI18n<[MessageSchema], 'en-US' | 'nl-BE'>({
    legacy: false,
    locale: Quasar.lang.getLocale(),
    fallbackLocale: 'en-US',
    messages: { 'en-US': enUS, 'nl-BE': nlBE },
  })

  app.use(i18n)
})

File 'LandingPage.vue'

<template>
  <q-page>
    <div>
      <q-card v-for="country in $tm('page.landing.countries')" :key="country.code">
        <q-card-section>
          <q-card-section>
            <div> {{ $rt(country.name) }} </div>
          </q-card-section>
        </q-card-section>
      </q-card>
    </div>
  </q-page>
</template>

This might be related to #91

Expected behavior

No TS errors

Reproduction

See this CodeSandBox for testing.

System Info

System:
    OS: Windows 10 10.0.20348
    CPU: (8) x64 Intel(R) Xeon(R) Gold 6242 CPU @ 2.80GHz
    Memory: 9.36 GB / 16.00 GB
  Binaries:
    Node: 20.11.1 - C:\Program Files\nodejs\node.EXE
    npm: 10.5.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Chromium (122.0.2365.92)
    Internet Explorer: 11.0.20348.2520
  npmPackages:
    vite-plugin-checker: ^0.6.4 => 0.6.4 
    vue: ^3.4.18 => 3.4.23 
    vue-i18n: ^9.9.0 => 9.12.1 
    vue-router: ^4.0.12 => 4.3.0 
    vue-tsc: ^1.8.22 => 1.8.27

Screenshot

Additional context

No response

Validations

• Read the Contributing Guidelines
• Read the Documentation
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion
• The provided reproduction is a minimal reproducible example of the bug.