Type inference with the watch callback argument for locale.

[kazupon]

Reporting a bug?

When locale is specified as the first argument of watch, the type inference of the watch callback argument cannot be inferred correctly.

Expected behavior

When locale is specified as the first argument of watch, the type inference of the watch callback argument should be inferred correctly.

locale type is WritableComputedRef<Locales>
https://github.com/intlify/vue-i18n-next/blob/master/packages/vue-i18n-core/src/composer.ts#L1131

so, watch callback argument type should be inferred with Locales.

Reproduction

https://github.com/intlify/vite-vue-i18n-starter/blame/repro-watch/src/App.vue#L26-L31

System Info

System:
    OS: macOS 10.15.7
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 390.03 MB / 64.00 GB
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 14.17.0 - ~/bin/.nvm/versions/node/v14.17.0/bin/node
    Yarn: 1.22.10 - ~/bin/.nvm/versions/node/v14.17.0/bin/yarn
    npm: 6.14.13 - ~/bin/.nvm/versions/node/v14.17.0/bin/npm
  Browsers:
    Chrome: 92.0.4515.131
    Safari: 14.1.2
  npmPackages:
    vue: ^3.2.1 => 3.2.1
    vue-i18n: ^9.2.0-beta.1 => 9.2.0-beta.1

Screenshot

No response

Additional context

Workaround:

watch((() => locale.value), newlocale => {
  console.log(typeof newLocale) // output is 'string'
})

watch(locale, newLocale => {
  const n = newLocale as unknown as string
})

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

[PeterAlfredLee]

@kazupon

This might be a work around:

watch(() => locale.value, newLocale => {
  console.log(typeof newLocale)
})

I just tested, in this case, the type of newLocale is string.

[kazupon]

@PeterAlfredLee
Oh... I forgot it use the function at watch 😅
Thanks!

So, I'll update the new workaround with your suggestion. 😉