#Set up vue-i18n in storybook (with nuxt 3)

1 messages · Page 1 of 1 (latest)

raven burrow
#

Hey, I'm currently building a nuxt 3 template for future projects of mine and as a base for other devs. I've just set up storybook and according CI with chromatic. Now I'm wondering how I'll be able to use vue-i18n inside of the stories. Has anybody succeeded using nuxt 3, vue-i18n and storybook together? If you're interested to test yourself you can start from my current template: https://github.com/jojomatik/nuxt-3-base

I've tried different approaches but I've not been able to get it running, it usually fails with Error: Cannot read properties of undefined (reading 't'). All the examples I found online either use pure vue (no nuxt) or use the old $t api instead of useI18n().t.

GitHub
GitHub - jojomatik/nuxt-3-base: A nuxt 3 project with vue3, vuetify...

A nuxt 3 project with vue3, vuetify, vue-i18n translation and composition API. - GitHub - jojomatik/nuxt-3-base: A nuxt 3 project with vue3, vuetify, vue-i18n translation and composition API.

real saddle
#

check #wg-vue i posted a repo

real saddle
raven burrow
#

Hi @real saddle , thanks for the repository! Have you tried setting up i18n yet? I'm using @nuxtjs/i18n, which works great in nuxt. Storybook works fine as well. I'm having issues with translated components in storybook though. It's the combination of those 3 that I can't get to work :\

#

Oh, I think I missed something. It's an module and not an example repository. I'll try it out tomorrow! Thanks!

real saddle
#

hi @raven burrow let me add an example for you on the demo repo.

raven burrow
#

Hi @real saddle , I just wanted to try the module, but it seems like I'm missing something. I switched the import and framework but I'm getting an immediate error. Could you take a look? Seems like the package.json -> exports is broken for the preset part. I've opened an issue: https://github.com/storybook-vue/nuxt/issues/2

GitHub
WARN Failed to load preset: "@storybook-vue/nuxt/preset" · Issue ...

After switching to this package in my project, I receive the following error. WARN Failed to load preset: "@storybook-vue/nuxt/preset" ERR! Error: Cannot find module '/home/runner/wor...

real saddle
#

hi @raven burrow i'm still working on it issues with package manager issue ! Thank you for you first opened issue 🙂

raven burrow