[webpack5] DefinePlugin cannot read property 'get' of undefined #14497
Comments
|
@paulrosania mind taking a look at this? i think at this point you know the most about this corner of Storybook 🙈 |
|
Think I'm seeing a related issue when trying to build after upgrading to 6.2.4 - Getting the following error: |
|
Having the exact same issue. Rolling back to v6.2.3 fixed it for me, too. |
|
ZOMG!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.2.5 containing PR #14501 that references this issue. Upgrade today to the Closing this issue. Please re-open if you think there's still more to do. |
|
Build works again! Thanks for the quick patch. |
|
👀. Fascinating. Sorry about this. Looks like Webpack v5 is being hoisted now in some configurations, leading to the break. I imagine the upgrade to I think when you move the manager build to Webpack 5 this is highly likely to rear its head again, since anything that shifts the balance of dependencies toward v5 is going to increase the odds of v5 getting hoisted. OTOH, if Storybook uses Webpack 5 exclusively internally (as opposed to a mix of 4 and 5) that might just work out fine, since the hoisted version would be correct. |
|
Folks who suffered from this issue: would you be willing to try the following to help me debug what's going on here?
That would help me create a stable repro. |
|
FYI: We have a monorepo. We only use WebPack for Storybook but for reasons I also included Validation that 6.2.4 is installed: yarn why v1.22.10
[1/4] Why do we have the module "@storybook/core"...?
[2/4] Initialising dependency graph...
[3/4] Finding dependency...
[4/4] Calculating file sizes...
=> Found "@storybook/[email protected]"
yarn why: yarn why v1.22.10
[1/4] Why do we have the module "webpack"...?
[2/4] Initialising dependency graph...
[3/4] Finding dependency...
[4/4] Calculating file sizes...
=> Found "[email protected]"
info Has been hoisted to "webpack"
info Reasons this module exists
- "workspace-aggregator-35efa460-4ea1-4972-b979-03b15ae8b181" depends on it
- Hoisted from "_project_#@xx#components#@storybook#react#webpack"
- Hoisted from "_project_#@xx#components#@storybook#addon-docs#@storybook#builder-webpack4#webpack"
- Hoisted from "_project_#@xx#components#@storybook#builder-webpack5#@storybook#core-common#webpack"
- Hoisted from "_project_#@xx#components#@storybook#addon-docs#@storybook#core#@storybook#core-server#webpack"
info Disk size without dependencies: "8.59MB"
info Disk size with unique dependencies: "21.98MB"
info Disk size with transitive dependencies: "46.59MB"
info Number of shared dependencies: 183
=> Found "@storybook/builder-webpack5#[email protected]"
info This module exists because "_project_#@xx#components#@storybook#builder-webpack5" depends on it.
Done in 7.70s.
yarn why v1.22.10
[1/4] Why do we have the module "dotenv-webpack"...?
[2/4] Initialising dependency graph...
[3/4] Finding dependency...
[4/4] Calculating file sizes...
=> Found "[email protected]"
info Reasons this module exists
- "_project_#@xx#components#@storybook#builder-webpack5" depends on it
- Hoisted from "_project_#@xx#components#@storybook#builder-webpack5#dotenv-webpack"
- Hoisted from "_project_#@xx#components#@storybook#addon-docs#@storybook#builder-webpack4#dotenv-webpack"
- Hoisted from "_project_#@xx#components#@storybook#addon-docs#@storybook#core#@storybook#core-server#dotenv-webpack"
info Disk size without dependencies: "48KB"
info Disk size with unique dependencies: "76KB"
info Disk size with transitive dependencies: "144KB"
info Number of shared dependencies: 2
Done in 4.28s.If you need more info, let me know :) |
|
This is super helpful, thank you. Taking a look now. |
|
I have a solid repro case now, thank you for your debugging info! # From an empty directory
npm init -y
npm install react{,-dom}@16
npm install -D @storybook/{addon-essentials,builder-webpack5,react}@6.2.4
mkdir .storybook
echo "module.exports = { core: { builder: 'webpack5' } };" > .storybook/main.js
npx start-storybook |
|
v6.2.5 works on my side too! I did check the versions of |
|
This still happens for me and I'm on 6.2.7. I've cleared my |
|
@matttk, could you send your package.json (dev)dependencies fields? |
|
|
Hmm. I've installed the same dependencies as you (added react and react-dom) and Storybook builds. Have you also deleted any |
|
Didn't help, unfortunately. I never had a Maybe my problem looks the same but is different...
|
|
it actually looks the same like it did for me when i had the problem. Does rolling back to v6.2.5 work for you? |
|
I didn't try that but I did try rolling back to 6.2.3 and that did not help. I will try 6.2.5. |
|
Interesting. 6.2.3 should actually work I guess. Maybe @paulrosania knows more |
@matttk It looks like you have similar issue what explained here: Mainly what solved the issue on my end is installing This SO answer gave me the idea, also see the reason for that here: #14403 (comment) |
|
OK, I've been reading a lot of different threads here and it seems what solved it for me was adding
Edit: deleted last part of post - it was about an error with SCSS not being recognised but I hadn't updated my Storybook is running now! 🎉 |
|
You will have this issue if you use the webpack5 builder and use parts of your own config that use |
|
#14576 will probably solve this |
Not sure if this is related to my problems, but I can reproduce errors with 6.2.9: |
|
If someone is still looking around for a solution, here is what worked for me :
"optimization": { This fixed the warning - "Cannot read property 'minify' of undefined" P.S: I followed all these steps while on storybook 6.2.7 version |
storybookjs/storybook#14497 and storybookjs/storybook#14403 tl;dr: Happo stopped working after #818 was merged, it turns out it is because `npm run build-storybook` crashed due to the above issue(s). Theoretically this is a workaround and can be removed after storybookjs/storybook#14403 is resolved, but there is no sign of when that'll happen Deep technical reasons from the linked issue for why this fails: > If npm hoists dotenv-webpack 6.0.4 to the node_modules root, everything works fine. However, if npm hoists dotenv-webpack 1.8, and the user has a .env file present, start-storybook fails to run. > > Unless the user is already pinning dotenv-webpack, the version that gets hoisted depends on how many dependencies are using 1.8 vs 6.0.4. (For example, in the repro steps below, if you remove @storybook/addon-essentials, npm hoists 6.0.4 and things work normally.) This makes for some extremely surprising and hard-to-pin-down behavior.
storybookjs/storybook#14497 and storybookjs/storybook#14403 tl;dr: Happo stopped working after #818 was merged, it turns out it is because `npm run build-storybook` crashed due to the above issue(s). Theoretically this is a workaround and can be removed after storybookjs/storybook#14403 is resolved, but there is no sign of when that'll happen Deep technical reasons from the linked issue for why this fails: > If npm hoists dotenv-webpack 6.0.4 to the node_modules root, everything works fine. However, if npm hoists dotenv-webpack 1.8, and the user has a .env file present, start-storybook fails to run. > > Unless the user is already pinning dotenv-webpack, the version that gets hoisted depends on how many dependencies are using 1.8 vs 6.0.4. (For example, in the repro steps below, if you remove @storybook/addon-essentials, npm hoists 6.0.4 and things work normally.) This makes for some extremely surprising and hard-to-pin-down behavior.
This one saved me! I upgraded some "inherited" repos and was struggling with this issue. Thanks! |
Describe the bug
I cannot build storybook using webpack5. I have the following error message with storybook
v6.2.4:I rollback to
v6.2.3and it works (it's probably caused bydotenv-webpackupgrade.To Reproduce
Here is my
main.js(not the original but this minimal one causes the issue).System
Additional context
Given the stack trace, it looks like
@storybook/core-serveris using webpack4 while root level is webpack5. Here isyarn why webpack┆Issue is synchronized with this Asana task by Unito
The text was updated successfully, but these errors were encountered: