How to Change Quasar Language Pack at Runtime

[Ali-hd]

I used this example template and applied this method as shown here in the docs.

But there is an error that appears in the command line:
import( 28 | /* webpackInclude: /(de|en-US)\.js$/ */ 29 | 'quasar/lang/' + val | ^ 30 | ) 31 | .then((lang) => { The above dynamic import cannot be analyzed by vite.

and the promis error shown in the console "TypeError: Failed to resolve module specifier 'quasar/lang/en-US'"

I want to a toggle switch that changes from ltr to rtl, I am hoping changing the language would help that. When I do $q.lang.set() it does what I want if I am switching from rtl to ltr but I can't switch it back to rtl.

Here is the production link
https://stackblitz.com/edit/quasarframework-tiwa3z?file=src/pages/IndexPage.vue

[Ali-hd]

Answering my own question:

I used this method and It works!

<script>
import { useQuasar, Quasar } from 'quasar'
import languages from 'quasar/lang/index.json'
import { ref} from 'vue'

const appLanguages = languages.filter(lang =>
  [ 'ar', 'en-US' ].includes(lang.isoName)
)

const langOptions = appLanguages.map(lang => ({
  label: lang.nativeName, value: lang.isoName
}))

const qLangList = import.meta.glob(
  '../node_modules/quasar/lang/(en-US|ar).mjs'
)

export default {
  setup () {
    const $q = useQuasar()
    const lang = ref($q.lang.isoName)
    return {
      lang,
      langOptions
    }
  },
  watch:{
    lang(val){
      this.setLang(val)
    }
  },
  methods: {
    async setLang(iso){
      try{
        console.log(qLangList)
        const lang = await qLangList[
      `../node_modules/quasar/lang/${iso}.mjs`
        ]()
        Quasar.lang.set(lang.default) 
      }catch(error){
        console.log('error setLang', error)
      }
    }
  }
}
</script>

<template>
  <q-select
    v-model="lang"
    :options="langOptions"
    label="Quasar Language"
    dense
    borderless
    emit-value
    map-options
    options-dense
    style="min-width: 150px"
  />
</template>

Make sure "qLangList" is not empty otherwise it means the languages are not imported.
Try changing the path "../" or "../../" depending on your project. And don't forget to change it here "await qLangList[<...>]"