i18n-t throws error after route change; __VUE_I18N_SYMBOL__ undefined

[julisch94]

Hey there!

I have an issue where vue-i18n works initially and translates the texts on the first page, but when changing the route and coming back to the same page as before then vue-i18n throws a SyntaxError in here:
https://github.com/intlify/vue-i18n-next/blob/acfba4b6f56323a7d3913db88e7bf2e25a2a3208/packages/vue-i18n-core/src/i18n.ts#L703-L709

On first load, VUE_I18N_SYMBOL is defined

Here the translation works as expected. The vue-i18n plugin seems to be installed correctly.

On second load, VUE_I18N_SYMBOL is undefined; breaking the translations (and throwing an error)

Here the if check in the highlighted line yields true, causing the code to throw an error Bn.NOT_INSTALLED.

NOTE that the _uid of t.appContext.app is different. Is this related to my issue?!

The error (not saying much but maybe it helps someone):

Environment

I'm using [email protected] with composition API (legacy: false), and the error is thrown by a i18n-t component in TSX.

I appreciate any help!

[julisch94]

So it seems that this returns different Vue instances depending on the time. The first one has i18n installed, the second one doesn't have i18n installed, hence the error. How can this happen?! Does anyone have any idea?

https://github.com/intlify/vue-i18n-next/blob/acfba4b6f56323a7d3913db88e7bf2e25a2a3208/packages/vue-i18n-core/src/i18n.ts#L699