Bug with i18n and translation in component

juleshry commented 3 months ago

Describe the bug

Hello,

First of all, thank you for building this project.

I'm working on a Nuxt project with i18n but I can't make histoire work correctly. I've been looking for the source of the problem and here's what I've discovered so far:

when the module @nuxtjs/i18n is active, there an error 500 displayed in the story iframe that says Cannot read properties of undefined (reading 'public'). I think it happens on module i18n initialization because it doesn't know the Nuxt App context or something (I'm not sure).
if I disabled the module @nuxtjs/i18n, there's an error when histoire is building that says RollupError: Expected ';', '}' or <eof>. I think this is due to translations 'in-component' using the <i18n></i18n> tag.

Reproduction

I have made a small project that reproduce the problem : https://stackblitz.com/edit/nuxt-starter-xfql3e?file=nuxt.config.ts

System Info

packages versions :
- nuxt: 3.10.3
- @nuxtjs/i18n: 8.2.0
- histoire: 0.17.14
- @histoire/plugin-vue: 0.17.14
- @histoire/plugin-nuxt: 0.17.14

Used Package Manager

npm

Validations

[X] Follow our Code of Conduct
[X] Read the Contributing Guidelines.
[X] Read the docs.
[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] Check that this is a concrete bug. For Q&A open a GitHub Discussion.
[X] The provided reproduction is a minimal reproducible example of the bug.

stackblitz[bot] commented 3 months ago

Start a new pull request in StackBlitz Codeflow.

nuxt-starter-xfql3e (Open reproduction)

SteinRobert commented 3 months ago

I can confirm this and tracked it down to this change: https://github.com/nuxt-modules/i18n/pull/2828

Not sure what to do about it though. Any idea? I'd be happy to contribute.

seosmmbusiness commented 3 months ago

Same problem. Fresh install of Nuxt + I18n + Histoire

 "dependencies": {
    "@nuxtjs/i18n": "^8.3.0",
    "nuxt": "^3.11.1",
    "vue": "^3.4.21",
    "vue-router": "^4.3.0"
  },
  "devDependencies": {
    "@histoire/plugin-nuxt": "^0.17.15",
    "@histoire/plugin-vue": "^0.17.15",
    "histoire": "^0.17.15"
  }

kstraszewski commented 3 months ago

Same problem here. Has someone manage to implement some kind of workaround?

letoast commented 2 months ago

+1

TheNaschkatze commented 3 weeks ago

please take care of this i dont want to fork @letoast repo xD and i want to deploy our component documentation :)

letoast commented 3 weeks ago

please take care of this i dont want to fork @letoast repo xD and i want to deploy our component documentation :)

TBH I'm going to try out nuxt storybook and see if everything works there.

alexardra commented 5 days ago

Having the same issue. As mentioned https://github.com/histoire-dev/histoire/issues/703#issuecomment-2025195493 - downgrading @nuxtjs/i18n to the version below 8.0.2 removed the error for me.

Would be nice to get some followup on this though.

histoire-dev / histoire