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.

Yarn 2 strict pnp: @storybook/components missing dependency on regenerator-runtime

See original GitHub issue

Describe the bug A clear and concise description of what the bug is.

To Reproduce Default storybook for react install in yarn 2 workspaces with strict pnp linker.

Yarn Workspaces difference is that pnp fallback forcebly disabled, same can be achieved in regular yarn package with yarn config set pnpFallbackMode none

Run yarn workspace storybook start, build fails with:

Module not found: Error: @storybook/components tried to access regenerator-runtime, but it isnโ€™t declared in its dependencies; this makes the require call ambiguous and unsound.

Expected behavior Storybook builds and starts dev server

Screenshots

Code snippets Adding regenerator-runtime as peer dependency fixes the error.

# .yarnrc.yml
packageExtensions:
  "@storybook/components@6.1.17":
    peerDependencies:
      regenerator-runtime: ">=0.11.1"

System

$ yarn dlx sb@next info

Environment Info:

System: OS: Linux 5.10 Fedora 33 (Workstation Edition) 33 (Workstation Edition) CPU: (8) x64 Intelยฎ Coreโ„ข i7-6700HQ CPU @ 2.60GHz Binaries: Node: 14.15.4 - /tmp/xfs-2274736b/node Yarn: 2.4.0 - /tmp/xfs-2274736b/yarn npm: 6.14.10 - /usr/bin/npm Browsers: Chrome: 88.0.4324.150 Firefox: 85.0

yarn info -A -R --dependents --virtuals @storybook/components โ”œโ”€ @storybook/components@npm:6.1.17 โ”‚ โ”œโ”€ Instances: 1 โ”‚ โ”œโ”€ Version: 6.1.17 โ”‚ โ”‚ โ”‚ โ”œโ”€ Dependents โ”‚ โ”‚ โ”œโ”€ @storybook/addon-actions@npm:6.1.17 โ”‚ โ”‚ โ”œโ”€ @storybook/addon-backgrounds@npm:6.1.17 โ”‚ โ”‚ โ”œโ”€ @storybook/addon-controls@npm:6.1.17 โ”‚ โ”‚ โ”œโ”€ @storybook/addon-docs@npm:6.1.17 โ”‚ โ”‚ โ”œโ”€ @storybook/addon-toolbars@npm:6.1.17 โ”‚ โ”‚ โ”œโ”€ @storybook/addon-viewport@npm:6.1.17 โ”‚ โ”‚ โ”œโ”€ @storybook/core@npm:6.1.17 โ”‚ โ”‚ โ””โ”€ @storybook/ui@npm:6.1.17 โ”‚ โ”‚ โ”‚ โ””โ”€ Dependencies โ”‚ โ”œโ”€ @popperjs/core@npm:^2.5.4 โ†’ npm:2.6.0 โ”‚ โ”œโ”€ @storybook/client-logger@npm:6.1.17 โ†’ npm:6.1.17 โ”‚ โ”œโ”€ @storybook/csf@npm:0.0.1 โ†’ npm:0.0.1 โ”‚ โ”œโ”€ @storybook/theming@npm:6.1.17 โ†’ npm:6.1.17 โ”‚ โ”œโ”€ @types/overlayscrollbars@npm:^1.9.0 โ†’ npm:1.12.0 โ”‚ โ”œโ”€ @types/react-color@npm:^3.0.1 โ†’ npm:3.0.4 โ”‚ โ”œโ”€ @types/react-syntax-highlighter@npm:11.0.4 โ†’ npm:11.0.4 โ”‚ โ”œโ”€ core-js@npm:^3.0.1 โ†’ npm:3.8.3 โ”‚ โ”œโ”€ fast-deep-equal@npm:^3.1.1 โ†’ npm:3.1.3 โ”‚ โ”œโ”€ global@npm:^4.3.2 โ†’ npm:4.4.0 โ”‚ โ”œโ”€ lodash@npm:^4.17.15 โ†’ npm:4.17.20 โ”‚ โ”œโ”€ markdown-to-jsx@npm:^6.11.4 โ†’ npm:6.11.4 โ”‚ โ”œโ”€ memoizerific@npm:^1.11.3 โ†’ npm:1.11.3 โ”‚ โ”œโ”€ overlayscrollbars@npm:^1.10.2 โ†’ npm:1.13.1 โ”‚ โ”œโ”€ polished@npm:^3.4.4 โ†’ npm:3.6.7 โ”‚ โ”œโ”€ react-color@npm:^2.17.0 โ†’ npm:2.19.3 โ”‚ โ”œโ”€ react-popper-tooltip@npm:^3.1.1 โ†’ npm:3.1.1 โ”‚ โ”œโ”€ react-syntax-highlighter@npm:^13.5.0 โ†’ npm:13.5.3 โ”‚ โ”œโ”€ react-textarea-autosize@npm:^8.1.1 โ†’ npm:8.3.0 โ”‚ โ””โ”€ ts-dedent@npm:^2.0.0 โ†’ npm:2.0.0 โ”‚ โ””โ”€ @storybook/components@npm:6.1.17 [22ebd] โ”œโ”€ Version: 6.1.17 โ”‚ โ”œโ”€ Dependents โ”‚ โ”œโ”€ @storybook/addon-actions@npm:6.1.17 [edd76] โ”‚ โ”œโ”€ @storybook/addon-backgrounds@npm:6.1.17 [dfc29] โ”‚ โ”œโ”€ @storybook/addon-controls@npm:6.1.17 [dfc29] โ”‚ โ”œโ”€ @storybook/addon-docs@npm:6.1.17 [edd76] โ”‚ โ”œโ”€ @storybook/addon-toolbars@npm:6.1.17 [dfc29] โ”‚ โ”œโ”€ @storybook/addon-viewport@npm:6.1.17 [dfc29] โ”‚ โ”œโ”€ @storybook/core@npm:6.1.17 [50077] โ”‚ โ””โ”€ @storybook/ui@npm:6.1.17 [aa913] โ”‚ โ””โ”€ Peer dependencies โ”œโ”€ @types/react-dom@* โ†’ โœ˜ โ”œโ”€ @types/react@* โ†’ โœ˜ โ”œโ”€ react-dom@^16.8.0 || ^17.0.0 โ†’ npm:17.0.1 [edd76] โ””โ”€ react@^16.8.0 || ^17.0.0 โ†’ npm:17.0.1

Additional context This is general issue exposed by yarn 2 being very strict with undeclared dependencies usage.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:7
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
shilmancommented, Feb 17, 2021

Yowza!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.2.0-alpha.29 containing PR #13916 that references this issue. Upgrade today to the @next NPM tag to try it out!

npx sb upgrade --prerelease

Closing this issue. Please re-open if you think thereโ€™s still more to do.

1reaction
acusticommented, Jun 18, 2021

iโ€™m still seeing this error using yarn 2 (actually v3.0.0-rc.5, but v3 is just a continuation, rather than a massive change like v1 to v2) and storybook v6.3.0-rc.11. iโ€™m directly depending on:

    "devDependencies": {
        "@storybook/addon-actions": "^6.3.0-rc.11",
        "@storybook/addon-docs": "^6.3.0-rc.11",
        "@storybook/addon-essentials": "^6.3.0-rc.11",
        "@storybook/addon-links": "^6.3.0-rc.11",
        "@storybook/addons": "^6.3.0-rc.11",
        "@storybook/react": "^6.3.0-rc.11",
    }

i started seeing the error in my builds after i added a .storybook/manager.js file with the following contents (the storybook keyboard shortcuts were interfering with testing keyboard navigation in my components):

import { addons } from '@storybook/addons';

addons.setConfig({
    enableShortcuts: false,
});

the error logs look like:

8:03:28 AM: ERR! => Failed to build the manager
8:03:28 AM: ERR! Module not found: Error: @storybook/addon-toolbars tried to access regenerator-runtime, but it isn't declared in its dependencies; this makes the require call ambiguous and unsound.
ERR!
8:03:28 AM: ERR! Required package: regenerator-runtime (via "regenerator-runtime/runtime.js")
8:03:28 AM: ERR! Required by: @storybook/addon-toolbars@virtual:a618fadbe95d42c5f4f251fa21aa877d1b0c9fd1aaaa0591b4f69956e188d9bd4b96b38687423c5fe8a967c6f60b021b7215038c2c153eb121e56ef819adb204#npm:6.3.0-rc.11 (via /opt/build/repo/.yarn/__virtual__/@storybook-addon-toolbars-virtual-c8d724d631/0/cache/@storybook-addon-toolbars-npm-6.3.0-rc.11-679b02ca5a-d4e7a0cc1a.zip/node_modules/@storybook/addon-toolbars/dist/esm/utils/register-shortcuts.js)
Full logs from 4 lines above ERR! to end (very repetitive but in case itโ€™s helpful)
8:03:28 AM: <s> [webpack.Progress] 69% building 1276/1294 modules 18 active /opt/build/repo/.yarn/cache/doctrine-npm-3.0.0-c6f1615f04-fd7673ca77.zip/node_modules/doctrine/lib/typed.js
8:03:28 AM: <s> [webpack.Progress] 69% building 1276/1295 modules 19 active /opt/build/repo/.yarn/cache/doctrine-npm-3.0.0-c6f1615f04-fd7673ca77.zip/node_modules/doctrine/lib/utility.js
8:03:28 AM: <s> [webpack.Progress] 69% building 1277/1295 modules 18 active /opt/build/repo/.yarn/cache/doctrine-npm-3.0.0-c6f1615f04-fd7673ca77.zip/node_modules/doctrine/lib/utility.js
8:03:28 AM: <s> [webpack.Progress] 69% building 1277/1296 modules 19 active /opt/build/repo/.yarn/__virtual__/babel-loader-virtual-004569f5fc/0/cache/babel-loader-npm-8.2.2-b4e600c2c5-df5092ef98.zip/node_modules/babel-loader/lib/index.js??ref--4-0!/opt/build/repo/.yarn/__virtual__/@acusti-styling-virtual-daf73669da/1/packages/styling/dist/Style.js
8:03:28 AM: ERR! => Failed to build the manager
8:03:28 AM: ERR! Module not found: Error: @storybook/addon-toolbars tried to access regenerator-runtime, but it isn't declared in its dependencies; this makes the require call ambiguous and unsound.
ERR!
8:03:28 AM: ERR! Required package: regenerator-runtime (via "regenerator-runtime/runtime.js")
8:03:28 AM: ERR! Required by: @storybook/addon-toolbars@virtual:a618fadbe95d42c5f4f251fa21aa877d1b0c9fd1aaaa0591b4f69956e188d9bd4b96b38687423c5fe8a967c6f60b021b7215038c2c153eb121e56ef819adb204#npm:6.3.0-rc.11 (via /opt/build/repo/.yarn/__virtual__/@storybook-addon-toolbars-virtual-c8d724d631/0/cache/@storybook-addon-toolbars-npm-6.3.0-rc.11-679b02ca5a-d4e7a0cc1a.zip/node_modules/@storybook/addon-toolbars/dist/esm/utils/register-shortcuts.js)
8:03:28 AM: ERR!
8:03:28 AM: ERR! ModuleNotFoundError: Module not found: Error: @storybook/addon-toolbars tried to access regenerator-runtime, but it isn't declared in its dependencies; this makes the require call ambiguous and unsound.
ERR!
8:03:28 AM: ERR! Required package: regenerator-runtime (via "regenerator-runtime/runtime.js")
8:03:28 AM: ERR! Required by: @storybook/addon-toolbars@virtual:a618fadbe95d42c5f4f251fa21aa877d1b0c9fd1aaaa0591b4f69956e188d9bd4b96b38687423c5fe8a967c6f60b021b7215038c2c153eb121e56ef819adb204#npm:6.3.0-rc.11 (via /opt/build/repo/.yarn/__virtual__/@storybook-addon-toolbars-virtual-c8d724d631/0/cache/@storybook-addon-toolbars-npm-6.3.0-rc.11-679b02ca5a-d4e7a0cc1a.zip/node_modules/@storybook/addon-toolbars/dist/esm/utils/register-shortcuts.js)
8:03:28 AM: ERR!
8:03:28 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/Compilation.js:925:10
8:03:28 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/NormalModuleFactory.js:401:22
8:03:28 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/NormalModuleFactory.js:130:21
8:03:28 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/NormalModuleFactory.js:224:22
8:03:28 AM: ERR!     at /opt/build/repo/.yarn/cache/neo-async-npm-2.6.2-75d6902586-deac9f8d00.zip/node_modules/neo-async/async.js:2830:7
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/neo-async-npm-2.6.2-75d6902586-deac9f8d00.zip/node_modules/neo-async/async.js:6877:13
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/NormalModuleFactory.js:214:25
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/Resolver.js:207:23
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/Resolver.js:283:21
8:03:29 AM: ERR!     at eval (eval at create (/opt/build/repo/.yarn/cache/tapable-npm-1.1.3-f1c2843426-53ff4e7c39.zip/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:7:1)
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:42:23
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/Resolver.js:283:21
8:03:29 AM: ERR!     at eval (eval at create (/opt/build/repo/.yarn/cache/tapable-npm-1.1.3-f1c2843426-53ff4e7c39.zip/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:7:1)
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/Resolver.js:283:21
8:03:29 AM: ERR!     at eval (eval at create (/opt/build/repo/.yarn/cache/tapable-npm-1.1.3-f1c2843426-53ff4e7c39.zip/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:22:1)
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:64:26
8:03:29 AM: ERR!  ModuleNotFoundError: Module not found: Error: @storybook/addon-toolbars tried to access regenerator-runtime, but it isn't declared in its dependencies; this makes the require call ambiguous and unsound.
ERR!
8:03:29 AM: ERR! Required package: regenerator-runtime (via "regenerator-runtime/runtime.js")
8:03:29 AM: ERR! Required by: @storybook/addon-toolbars@virtual:a618fadbe95d42c5f4f251fa21aa877d1b0c9fd1aaaa0591b4f69956e188d9bd4b96b38687423c5fe8a967c6f60b021b7215038c2c153eb121e56ef819adb204#npm:6.3.0-rc.11 (via /opt/build/repo/.yarn/__virtual__/@storybook-addon-toolbars-virtual-c8d724d631/0/cache/@storybook-addon-toolbars-npm-6.3.0-rc.11-679b02ca5a-d4e7a0cc1a.zip/node_modules/@storybook/addon-toolbars/dist/esm/utils/register-shortcuts.js)
8:03:29 AM: ERR!
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/Compilation.js:925:10
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/NormalModuleFactory.js:401:22
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/NormalModuleFactory.js:130:21
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/NormalModuleFactory.js:224:22
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/neo-async-npm-2.6.2-75d6902586-deac9f8d00.zip/node_modules/neo-async/async.js:2830:7
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/neo-async-npm-2.6.2-75d6902586-deac9f8d00.zip/node_modules/neo-async/async.js:6877:13
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/__virtual__/webpack-virtual-a4ee16b43e/0/cache/webpack-npm-4.46.0-a8158cfa7f-013fa24c00.zip/node_modules/webpack/lib/NormalModuleFactory.js:214:25
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/Resolver.js:207:23
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/Resolver.js:283:21
8:03:29 AM: ERR!     at eval (eval at create (/opt/build/repo/.yarn/cache/tapable-npm-1.1.3-f1c2843426-53ff4e7c39.zip/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:7:1)
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:42:23
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/Resolver.js:283:21
8:03:29 AM: ERR!     at eval (eval at create (/opt/build/repo/.yarn/cache/tapable-npm-1.1.3-f1c2843426-53ff4e7c39.zip/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:7:1)
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/Resolver.js:283:21
8:03:29 AM: ERR!     at eval (eval at create (/opt/build/repo/.yarn/cache/tapable-npm-1.1.3-f1c2843426-53ff4e7c39.zip/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:22:1)
8:03:29 AM: ERR!     at /opt/build/repo/.yarn/cache/enhanced-resolve-npm-4.5.0-1bcc7900d2-4d87488584.zip/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:64:26
Read more comments on GitHub >

github_iconTop Results From Across the Web

Yarn 2 strict pnp: @storybook/components missing ... - Issuehunt
Run yarn workspace storybook start , build fails with: Module not found: Error: @storybook/components tried to access regenerator-runtime, but it isn't declaredย ...
Read more >
@storybook/builder-webpack4 | Yarn - Package Manager
Fast, reliable, and secure dependency management.
Read more >
How to fix - Module not found: Can't resolve '@babel/runtime ...
Else it's going to be missing when doing a production installation (which leaves out the devDependencies section), which is what happened to me....
Read more >
https://raw.githubusercontent.com/storybooks/story...
Frameworks: Vue 3, Svelte Native CSF Packaging: NPM 7, Yarn 2, ESM Bundlers: ... Bug Fixes - Components: Add missing `regenerator-runtime` dependency ......
Read more >
[warning] the runtime detected new informations in a pnp file ...
After removing that outdated package.json I get the expected output: yarn install v0.27ย ...
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