Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Bug]: Storybook 7.1 interactions addon fails to build with Yarn PnP #23570

Closed
Methuselah96 opened this issue Jul 24, 2023 · 6 comments · Fixed by #23597
Closed

[Bug]: Storybook 7.1 interactions addon fails to build with Yarn PnP #23570

Methuselah96 opened this issue Jul 24, 2023 · 6 comments · Fixed by #23597
Assignees
@ndelangen
Labels
addon: interactions bug sev:S2 upgrade:7.1 yarn

Comments

@Methuselah96
Copy link
Contributor

Methuselah96 commented Jul 24, 2023 •
edited
Loading

Describe the bug

Storybook 7.1 introduces an issue when trying to build and start Storybook with Webpack using Yarn PnP. The output of running yarn build-storybook is this:

@storybook/cli v7.2.0-alpha.0

info => Cleaning outputDir: \storybook-static
info => Loading presets
info => Building manager..
info => Manager built (1.88 s)
info => Compiling preview..
info => Copying static files: C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\@storybook-manager-npm-7.2.0-alpha.0-2ad5c945fc-3e08d89dd1.zip\node_modules\@storybook\manager\static at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\storybook-static\sb-common-assets
info Addon-docs: using MDX2
info => Using implicit CSS loaders
info => Using default Webpack5 setup
ERR! => Failed to build the preview
ERR! Module not found: Error: Can't resolve 'url' in 'C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\jest-util-npm-29.6.1-b316c3a23f-fc553556c1.zip\node_modules\jest-util\build'
ERR!
ERR! BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
ERR! This is no longer the case. Verify if you need this module and configure a polyfill for it.
ERR!
ERR! If you want to include a polyfill, you need to:
ERR!    - add a fallback 'resolve.fallback: { "url": require.resolve("url/") }'
ERR!    - install 'url'
ERR! If you don't want to include a polyfill, you can use an empty module like this:
ERR!    resolve.fallback: { "url": false }
ERR! ModuleNotFoundError: Module not found: Error: Can't resolve 'url' in 'C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\jest-util-npm-29.6.1-b316c3a23f-fc553556c1.zip\node_modules\jest-util\build'
ERR!
ERR! BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
ERR! This is no longer the case. Verify if you need this module and configure a polyfill for it.
ERR!
ERR! If you want to include a polyfill, you need to:
ERR!    - add a fallback 'resolve.fallback: { "url": require.resolve("url/") }'
ERR!    - install 'url'
ERR! If you don't want to include a polyfill, you can use an empty module like this:
ERR!    resolve.fallback: { "url": false }
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\Compilation.js:2022:28
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:817:13
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:10:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:275:22
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:9:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:448:22
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:118:11
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:689:25
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:893:8
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:1013:5
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\neo-async-npm-2.6.2-75d6902586-deac9f8d00.zip\node_modules\neo-async\async.js:6883:13
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:996:45
ERR!     at finishWithoutResolve (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:372:11)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:461:15
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:27:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:89:43
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\forEachBail.js:39:13
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\AliasPlugin.js:148:14
ERR!     at next (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\forEachBail.js:35:3)
ERR!     at forEachBail (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\forEachBail.js:49:9)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\AliasPlugin.js:61:5
ERR!     at _next0 (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:8:1)
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:30:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:27:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:89:43
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\DirectoryExistsPlugin.js:41:15
ERR!     at processTicksAndRejections (node:internal/process/task_queues:81:21)
ERR!     at runNextTicks (node:internal/process/task_queues:64:3)
ERR!     at process.processImmediate (node:internal/timers:442:9)
ERR!  ModuleNotFoundError: Module not found: Error: Can't resolve 'url' in 'C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\jest-util-npm-29.6.1-b316c3a23f-fc553556c1.zip\node_modules\jest-util\build'
ERR!
ERR! BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
ERR! This is no longer the case. Verify if you need this module and configure a polyfill for it.
ERR!
ERR! If you want to include a polyfill, you need to:
ERR!    - add a fallback 'resolve.fallback: { "url": require.resolve("url/") }'
ERR!    - install 'url'
ERR! If you don't want to include a polyfill, you can use an empty module like this:
ERR!    resolve.fallback: { "url": false }
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\Compilation.js:2022:28
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:817:13
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:10:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:275:22
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:9:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:448:22
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:118:11
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:689:25
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:893:8
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:1013:5
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\neo-async-npm-2.6.2-75d6902586-deac9f8d00.zip\node_modules\neo-async\async.js:6883:13
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\__virtual__\webpack-virtual-19f90b1b2e\0\cache\webpack-npm-5.88.2-38717ace6f-79476a782d.zip\node_modules\webpack\lib\NormalModuleFactory.js:996:45
ERR!     at finishWithoutResolve (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:372:11)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:461:15
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:27:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:89:43
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\forEachBail.js:39:13
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\AliasPlugin.js:148:14
ERR!     at next (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\forEachBail.js:35:3)
ERR!     at forEachBail (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\forEachBail.js:49:9)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\AliasPlugin.js:61:5
ERR!     at _next0 (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:8:1)
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:30:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:27:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:89:43
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\Resolver.js:519:5
ERR!     at eval (eval at create (C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\tapable-npm-2.2.1-8cf5ff3039-3b7a1b4d86.zip\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
ERR!     at C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\enhanced-resolve-npm-5.15.0-16eb7ddef9-fbd8cdc926.zip\node_modules\enhanced-resolve\lib\DirectoryExistsPlugin.js:41:15
ERR!     at processTicksAndRejections (node:internal/process/task_queues:81:21)
ERR!     at runNextTicks (node:internal/process/task_queues:64:3)
ERR!     at process.processImmediate (node:internal/timers:442:9)
ERR! resolve 'url' in 'C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\jest-util-npm-29.6.1-b316c3a23f-fc553556c1.zip\node_modules\jest-util\build'
ERR!   Parsed request is a module
ERR!   using description file: C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\jest-util-npm-29.6.1-b316c3a23f-fc553556c1.zip\node_modules\jest-util\package.json (relative path: ./build)
ERR!     Field 'browser' doesn't contain a valid alias configuration
ERR!     resolve as module
ERR!       request is not managed by the pnpapi
ERR!         jest-util tried to access url. While this module is usually interpreted as a Node builtin, your resolver is running inside a non-Node resolution context where such builtins are ignored. Since url isn't otherwise declared in jest-util's dependencies, this makes the require call ambiguous and unsound.
ERR!         Required package: url
ERR!         Required by: C:\Users\nbier\Documents\storybook-7-1-yarn-pnp\.yarn\cache\jest-util-npm-29.6.1-b316c3a23f-fc553556c1.zip\node_modules\jest-util\build\
√ Would you like to help improve Storybook by sending anonymous crash reports? ... no

attention => Storybook now collects completely anonymous telemetry regarding usage.
This information is used to shape Storybook's roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://storybook.js.org/telemetry

To Reproduce

https://github.com/Methuselah96/storybook-7-1-yarn-pnp

Starting from a fresh Storybook, steps to reproduce are:

  1. yarn set version stable (to use Yarn PnP)
  2. yarn install
  3. yarn build-storybook
  4. Observe error

System

Environment Info:

  System:
    OS: Windows 10 10.0.22621
    CPU: (8) x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
  Binaries:
    Node: 18.12.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 3.6.1 - C:\Program Files\nodejs\yarn.CMD
    npm: 8.19.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.1992.0), Chromium (115.0.1901.183)

Additional context

Looks to be the same root issue as #23557, in my opinion closed too early. It should be safe for Storybook to be hoisted and is a sign of a deeper issue.
@Methuselah96 Methuselah96 changed the title [Bug]: Storybook 7.1 doesn't work with strict package managers Yarn PnP [Bug]: Storybook 7.1 doesn't work with strict package managers (e.g., Yarn PnP) Jul 24, 2023
@Methuselah96 Methuselah96 changed the title [Bug]: Storybook 7.1 doesn't work with strict package managers (e.g., Yarn PnP) [Bug]: Storybook 7.1 fails to build with strict package managers (e.g., Yarn PnP) Jul 24, 2023
@Methuselah96 Methuselah96 changed the title [Bug]: Storybook 7.1 fails to build with strict package managers (e.g., Yarn PnP) [Bug]: Storybook 7.1 fails to build with Yarn PnP Jul 24, 2023
@Methuselah96
Copy link
Contributor Author

Looking at the actual error, it seems bad that Webpack is trying to include jest-util in the build. I don't know why this is happening, but it seems likely it shouldn't be included in the build.

@frontend-dohun-kim
Copy link

frontend-dohun-kim commented Jul 24, 2023 •
edited
Loading

write in your yarnrc.yml,

packageExtensions:
  'jest-util@*':
    dependencies:
      'process': '^0.11.10'
      'url': '^0.11.1'
  'graceful-fs@*':
    dependencies:
      'util': '^0.12.5'

and run yarn install

@Methuselah96
Copy link
Contributor Author

Methuselah96 commented Jul 24, 2023 •
edited
Loading

But why are jest and graecful-fs being bundled? It seems like those should be Node-only and not included in a browser bundle.

@Methuselah96
Copy link
Contributor Author

Methuselah96 commented Jul 24, 2023 •
edited
Loading

It seems like this issue first surfaced in 7.1.0-alpha.30, probably caused by #22979.

@Methuselah96
Copy link
Contributor Author

Methuselah96 commented Jul 24, 2023 •
edited
Loading

Looking into this more, it looks like @storybook/addon-interactions depends on jest-mock. Since I don't use @storybook/addon-interactions I can just remove that addon to proceed, but seems like this would still be an issue for those wanting to use the interactions addon.

@Methuselah96 Methuselah96 changed the title [Bug]: Storybook 7.1 fails to build with Yarn PnP [Bug]: Storybook 7.1 interactions addon fails to build with Yarn PnP Jul 24, 2023
@jasosims
Copy link

jasosims commented Jul 24, 2023 •
edited
Loading

I'm seeing this (seemingly related) warning in my JS console when running Storybook with yarn (classic):

[HMR] bundle 'preview' has 2 warnings
./node_modules/@storybook/addon-interactions/node_modules/jest-util/build/requireOrImportModule.js 44:27-44
Critical dependency: the request of a dependency is an expression
./node_modules/@storybook/addon-interactions/node_modules/jest-util/build/requireOrImportModule.js 55:37-59
Critical dependency: the request of a dependency is an expression

It doesn't prevent Storybook from starting or running, but I'd like to get rid of the warning. First started seeing this warning after updating to Storybook 7.1, and it's still present on 7.1.1. I do use addon-interactions and don't want to disable it.

@ndelangen ndelangen self-assigned this Jul 25, 2023
@ndelangen ndelangen mentioned this issue Jul 25, 2023
Closed
5 tasks
@ndelangen ndelangen mentioned this issue Jul 25, 2023
Merged
@vanessayuenn vanessayuenn mentioned this issue Jul 25, 2023
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@ndelangen ndelangen

Labels
addon: interactions bug sev:S2 upgrade:7.1 yarn
Projects
Core Team Projects
Archived in project
Milestone
No milestone
6 participants
@Methuselah96 @ndelangen @valentinpalkovic @vanessayuenn @jasosims @frontend-dohun-kim