-
-
Notifications
You must be signed in to change notification settings - Fork 29
Does not work with @nrwl/react/plugins/storybook
addon
#100
Comments
Hey @anatoo, thanks for your PR, I was facing same issue. Example suggests to modify only one rule with So, I've added exclude to all of them and it seems to be working (config attached) webpackFinal: (config) => {
// this modifies the existing image rule to exclude .svg files
// since we want to handle those files with @svgr/webpack
const svgRules = config.module.rules.filter((rule) =>
rule.test.test('.svg'),
);
svgRules.forEach((rule) => {
rule.exclude = /\.svg$/;
});
// configure .svg files to be loaded with @svgr/webpack
config.module.rules.push({
test: /\.svg$/,
use: ['@svgr/webpack'],
});
return config;
} tl;dr can you share your Webpack config? If my issue is reproducible - we probably should update readme as well |
I have a related issue. Nx mono repository with Next.js frontend and Storybook. Everything is mostly default settings.
This line throws the error because
|
I have the same problem as well, any suggested fixes for this? |
I've fixed this by downgrading |
We are already looking into it! Thank you all for reporting! |
This PR will solve the issue |
@mandarini I have trouble in an NX monorepo even after the nrwl/nx#12371 was merged. Can I in any way assist in resolving the issue? |
Hi @vdumitraskovic ! I'll take a look at this next week. What you can do is run the command with verbose, and see where exactly in the code the error happens. What you can also do, is create a reproduction repository and link it here so that I can reproduce this locally. Thank you!!! :D :D |
@mandarini here is the repro repo: https://github.com/vdumitraskovic/storybook-addon-next-with-nx-repro/ The app breaks as soon as there is a SVG icon imported with svgr, like import { ReactComponent as Icon } from './icon.svg'; The error happens in the I hope this helps. |
I'm currently facing the same issue with the same version of the addon. Even if I change my current Webpack config and add a particular rule to bypass this issue, it still fails. |
Hi all, thanks for posting in this issue. I'm on leave for the next couple of weeks, so I will not have time to look into this. I'll ping @jaysoo just in case, but most probably I will be the one to look into this. Please bear with me (and my time off :P)! |
Ok, potentially this PR fixes the issue. Maybe yes, maybe no. Edit: it does not :( |
🎉 This issue has been resolved in version 1.6.10 🎉 The release is available on: Your semantic-release bot 📦🚀 |
Thank you SO much @RyanClementsHax ! Heyy can you all please test again to make sure all is fixed now? |
Thanks everyone! |
FYI This same exact issue is still present when using @nx/react/plugins/storybook and the framework @storybook/nextjs. Stemming from the next-image-loader-stub.js inside storybook/nextjs nx 16.4 |
This issue RyanClementsHax/storybook-addon-next#100 involving storybook-addon-next and the nx plugin @nx/react/plugin/storybook was resolved RyanClementsHax/storybook-addon-next#101, but that fix didn't make it to this equivalent file here in @storybook/nextjs, making that issue still present when using Storybook 7 and @storybook/nextjs as the framework.
Describe the bug
Storybook gives the error:
Your minimal, reproducible example
None
Steps to reproduce
@nrwl/react/plugins/storybook
addon to ".storybook/main.js"Expected behavior
Storybook start normally
How often does this bug happen?
Every time
Screenshots or Videos
No response
Platform
storybook-addon-next version
v1.6.7
Additional context
@nrwl/react/plugin/storybook
add the below webpack loader rule.storybook-addon-next
'sconfigureStaticImageImport
function refergenerator.filename
option of the rule.https://github.com/RyanClementsHax/storybook-addon-next/blob/main/src/images/webpack.ts#L15-L41
As a result, the
generator.filename
option is undefined and the storybook is broken.The text was updated successfully, but these errors were encountered: