i18n named formatting not working after build with Vite

[luxi78]

What happened?

I created a new Quasar project with Vite then modify the following files like that: src/i18n/en-US/index.ts

export default {
  hello: 'Hello, {name}!'
}

src/pages/IndexPage.vue

<template>
  <q-page class="row items-center justify-evenly">
    <p>{{ $t('hello', { name: 'World' }) }}</p>
  </q-page>
</template>

The result of quasar dev is as expected.

However, after running quasar build && quasar serve dist/spa, the named formatting does not work.

If I create a new Quasar project with Webpack, everything works fine.

What did you expect to happen?

The named formatting should work after the build, just like it does in development.

Reproduction URL

https://github.com/luxi78/quasar_i18n_bug_report

How to reproduce?

1. Use yarn create quasar to create a new Quasar project with following options: ✔ What would you like to build? › App with Quasar CLI, let's go! ✔ Project folder: … quasar-project ✔ Pick Quasar version: › Quasar v2 (Vue 3 | latest and greatest) ✔ Pick script type: › Typescript ✔ Pick Quasar App CLI variant: › Quasar App CLI with Vite 2 (stable | v1) ✔ Package name: … quasar-project ✔ Project product name: (must start with letter if building mobile apps) … Quasar App ✔ Project description: … A Quasar Project ✔ Author: … luxi78 luxi78@gmail.com ✔ Pick a Vue component style: › Composition API with Githubissues.

2. Githubissues is a development platform for aggregating issues.