question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Storybook doesn't recognize what's new in next/image.

See original GitHub issue

Describe the bug The next/image no longer requires width, height, layout=“fill” when accessing the public directory. (next 11) But the storybook doesn’t seem to recognize this.

Image with src "..." must use "width" and "height" properties or "layout='fill'" property.

System Environment Info:

System: OS: macOS 11.4 CPU: (16) x64 Intel® Core™ i9-9880H CPU @ 2.30GHz Binaries: Node: 14.15.4 - /usr/local/bin/node Yarn: 1.22.10 - /usr/local/bin/yarn npm: 6.14.10 - /usr/local/bin/npm Browsers: Chrome: 91.0.4472.114 Firefox: 87.0 Safari: 14.1.1 npmPackages: @storybook/addon-actions: ^6.4.0-alpha.5 => 6.4.0-alpha.5 @storybook/addon-essentials: ^6.4.0-alpha.5 => 6.4.0-alpha.5 @storybook/addon-links: ^6.4.0-alpha.5 => 6.4.0-alpha.5 @storybook/react: ^6.4.0-alpha.5 => 6.4.0-alpha.5

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:9 (4 by maintainers)

github_iconTop GitHub Comments

3reactions
shilmancommented, Jun 30, 2021

@soulcactus agreed. this is a nextjs feature, so ideally the nextjs integration for storybook provides this feature somehow. i can imagine a webpack loader/plugin that implements this somehow–not sure how it’s implemented inside nextjs

1reaction
David-Rickardcommented, Oct 12, 2022
Read more comments on GitHub >

github_iconTop Results From Across the Web

Image component does not work with Storybook · Issue #18393
I got an error in Storybook when trying to use next.js Image with src using another host. I have domains set properly in...
Read more >
How to Use the Next.js Image Component in Storybook
I myself ran into two: Storybook can't seem to find the image you statically import from your public directory, resulting in the following ......
Read more >
Storybook doesn't recognize what's new in next/image. #15407
With next/image(major version 10), only alt messages are rendered in the storybook, but at least the error log does not appear. However, the...
Read more >
Storybook Addon Next
Statically imported images won't load; This addon breaks when the .mjs extension for the next config is used; Module not found: Error: Can't...
Read more >
How to mock Next.js Image component in Storybook?
First we need to define an env variable with the default settings to get rid of the error. We can do this by...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found