histoire-dev / histoire-dev/histoire
Nuxt/image-edge + Histoire doesnt't work
- Dominant language
- TypeScript
- Stars
- 3.6k
- Forks
- 212
- PR merge metrics
- No merged PRs in 30d
Description
### Describe the bug
- I have made a fresh nuxt project on stackblitz (and locally via Nuxt's "getting started" instructions)
- then installed histoire while following the getting started for nuxt 3
- then installed Nuxt/image-edge follwing the getting started for nuxt 3
- then created a basic Image.vue and Image.story.vue, and got the following errors in console when trying to run Histoire:

For used package manager - I use yarn locally but the reproduction stackblitz uses npm
### Reproduction
[StackBlitz](https://stackblitz.com/edit/nuxt-starter-fbr3jz?file=components%2FImage.vue,nuxt.config.ts)
### System Info
```shell
System:
OS: macOS 13.0.1
CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Memory: 7.64 MB / 16.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 16.17.1 - ~/Library/Caches/fnm_multishells/43544_1669964830256/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 8.15.0 - ~/Library/Caches/fnm_multishells/43544_1669964830256/bin/npm
Browsers:
Chrome: 107.0.5304.121
Firefox: 106.0.1
Firefox Developer Edition: 108.0
Safari: 16.1
```
### Used Package Manager
npm
### Validations
- [X] Follow our [Code of Conduct](https://github.com/histoire-dev/histoire/blob/main/CODE_OF_CONDUCT.md)
- [X] Read the [Contributing Guidelines](https://github.com/histoire-dev/histoire/blob/main/CONTRIBUTING.md).
- [X] Read the [docs](https://histoire.dev/guide/).
- [X] Check that there isn't [already an issue](https://github.com/histoire-dev/histoire/issues) 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](https://github.com/histoire-dev/histoire/discussions).
- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.
Contributor guide
Research direction
Start by opening the StackBlitz reproduction and reviewing components/Image.vue, Image.story.vue, and nuxt.config.ts. Run Histoire with the Nuxt/image-edge setup, trace the console errors, and verify that the Image story loads without those errors.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nuxtjs
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100