Documentation does not show usage within `<scripts>` - How to use `$t`, `$tc`, `$d`, `$n`?

[MickL]

Clear and concise description of the problem

The docs are really great! I just dont see how to use all this amazing template functions within the script, e.g. $t, $tc, $d, $n. If I try to use them within I get an error that they are not defined.

Suggested solution

For each template function provide one example on how to use them within <script>

Validations

• Read the Contributing Guidelines
• Read the Documentation
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

P.S. When googling "vue i18n" the first result links to 8.x docs with no information that this is an old version. This is especially problematic because there are breaking changes and also the new docs look more nice :) It would be great to add a message that there is a more current version. E.g. Bootstrap adds an info at the very top: https://getbootstrap.com/docs/4.6/getting-started/introduction/

[HendrikJan]

Do you know how to do it?

I'm looking for an answer as well.

[MickL]

I think it is the same naming without $ from i18n instance. I use Nuxt so I do:

const { n } = useI18n();

n(100, 'currency');

I assume without Nuxt it would be something like this?

i18n.n(100, 'currency')

[HendrikJan]

Okay, than I'm having another problem.
I'm using Nuxt3 as well.

useI18n() tells me: "cannot find name 'useI18n'".

But if I do import { useI18n } from 'vue-i18n' is tells me: "'vue-i18n' has no exported member 'useI18n`"

It seems like this is no problem in your case.

[MickL]

Yes it is. But regarding your issue: You will not import it from vue-18n because it is from nuxt-i18n. But it is already auto imported. My guess is you didnt add @nuxtjs/i18n to your nuxt.config modules

[HendrikJan]

True, because the documentation of v9 did not tell met in install @nuxtjs/i18n.
It tells to write your own Nuxt plugin: https://vue-i18n.intlify.dev/guide/integrations/nuxt3.html

I'll see if I can install and use @nuxtjs/i18n.

[MickL]

Use @nuxtjs/i18n instead, it is pretty awesome!