Image paths point to _ipx directory in storybook export
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 1.5k
- Forks
- 331
- Avg merge
- 19h 52m
- Merged PRs (30d)
- 9
Description
Component
<nuxt-img
src="/images/square.png"
...
/>
Using yarn generate and then yarn start, optimised images are found in the _nuxt/ directory as expected:

Issue
The @nuxtjs/storybook module offers the ability to build (export) a storybook as a static site.
However, since this doesn't utilise server-side rendering, the <nuxt-img> component will point to the _ipx/ provider path in this build.

This image is available at the _ipx/ path in development mode, such as in yarn storybook and yarn dev:

So, either @nuxtjs/storybook needs to utilise server-side rendering, or @nuxt/image needs to handle the case of process.server = false when serving local static files.
Let me know if I need to take this to nuxt-community/storybook instead.
Reproduction
Using @nuxtjs/storybook, execute the command:
yarn storybook build
The resulting storybook uses the _ipx/ path instead of _nuxt/ for images.
Packages
"nuxt": "^2.15.8",
"@nuxt/image": "^0.7.1",
"@nuxtjs/storybook": "^4.3.2",
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by running yarn storybook build with the listed Nuxt, @nuxt/image, and @nuxtjs/storybook versions, then compare the exported image paths with those from yarn generate and development mode. Trace how the static Storybook build selects the image provider. Done means exported stories reference available image files rather than _ipx/ paths.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nuxt
- Domain
- build-system, frontend, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100