Change locale when the initiliazition is in external file

[st1nkata9]

Hello everybody,
I am using Vue3 and vue-i18n. I have a file called i18n.js located where are the App.vue file and main.js. In this file i have initialized the component like this:

import { createI18n } from 'vue-i18n';
import translations from '@/translation.js';

const i18n = createI18n({
  legacy: false,
  locale: '', // It's empty because i want to set it in App.vue
  fallbackLocale: 'de', 
  translation,
});

export default i18n;

Then i can import this file and use the i18n.global.t('translation.KEY');
But it's never switch the language. It always de=Deutsch.
In my App.vue file i am reading client settings from a file and on the mounted section after i read it i am setting the locale like this:

this.$i18n.locale = .....;
i18n.global.locale = ....;

Also in the settings tab on change of multiselect i am changing it and save it to file. But it's not working. Always shows the Deutsch text. If I remove the fallbackLocale it displays:
translation.KEY....

I think the problem is because the vue-i18n is initialized before App.vue is loaded.

Is there any solution of this problem?