i18n-t/translation components within custom elements throw appContext.app error
yashha opened this issue · comments
Reporting a bug?
The i18n-t/translation components seem not to support a custom component environment.
They throw a instance.appContext.app is null error.
It seems to be related to this ticket #628 which has been fixed by @kazupon.
Expected behavior
The i18n-t/translation component should not be dependend on appContext.app when it is loaded within a custom element.
Reproduction
https://stackblitz.com/edit/vitejs-vite-4dvqbr?file=src%2Fcomponents%2FHelloBlock.ce.vue
System Info
System:
OS: Linux 5.0 undefined
CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Memory: 0 Bytes / 0 Bytes
Shell: 1.0 - /bin/jsh
Binaries:
Node: 18.18.0 - /usr/local/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 9.4.2 - /usr/local/bin/npm
pnpm: 8.9.2 - /usr/local/bin/pnpm
npmPackages:
@intlify/unplugin-vue-i18n: ^1.0.1 => 1.0.1
@vitejs/plugin-vue: ^4.2.3 => 4.3.4
vite: ^4.4.9 => 4.4.9
vue: ^3.3.4 => 3.3.4
vue-i18n: ^9.3.0 => 9.3.0
vue-tsc: ^1.8.8 => 1.8.10Screenshot
Additional context
No response
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 Discussions
Thank you for your reporting!
I noticed that your reproduction code isn't setup createApp and vue-i18n installing.
fully example codes is here
https://github.com/intlify/vue-i18n-next/tree/master/examples/web-components
and I'll add example code link at docs.
@kazupon
I did create a host component an did wrap it around the other custom element, do I wrap the each component before converting it to a custom element?
Can you maybe add the usage of i18n-t to the examples directory or fork my stackblitz
https://stackblitz.com/edit/vitejs-vite-4dvqbr?file=src%2Fcomponents%2FHelloBlock.ce.vue