storybook: 5.0.0-rc4 - cannot read property 'secondary' of undefined

Ahh, gotcha. FWIW, I can work around the issue by adding an explicit dependency for @storybook/theming in my package.json

For anyone running into the EntryModuleNotFoundError (I landed here while Googling / troubleshooting) I want to point out that it sounds like this is specific to yarn and that @jdelStrother’s recommendation fixed it for me:

Ahh, gotcha. FWIW, I can work around the issue by adding an explicit dependency for @storybook/theming in my package.json

📝 I’m also not using any custom theming. I did try blowing away node_modules and even yarn.lock. Still had the same issue with 5.0.0. yarn add -D @storybook/theming did the trick.

FWIW here is my entire diff (minus lock file) for upgrading a project from 4.x -> 5.0.0 just now. Thank you to all who were involved in this effort! Seriously great work 😃

diff --git a/package.json b/package.json
index 0c5553602..316257f68 100644
--- a/package.json
+++ b/package.json
@@ -58,11 +58,12 @@
     "@babel/preset-env": "7.3.4",
     "@babel/preset-react": "7.0.0",
     "@babel/register": "7.0.0",
-    "@storybook/addon-actions": "4.1.13",
-    "@storybook/addon-knobs": "4.1.13",
-    "@storybook/addon-links": "4.1.13",
-    "@storybook/addons": "4.1.13",
-    "@storybook/react": "4.1.13",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/react": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "babel-eslint": "10.0.1",
     "babel-loader": "8.0.5",
     "babel-plugin-syntax-async-functions": "6.13.0",

Ran into the same issue.

I can confirm that deleting yarn.lock and adding @storybook/theming with a fresh install of node_modules worked to solve this.

Thanks for the help @shilman and bringing up the issue @jdelStrother.

After much debugging of the clash between versions of emotion used in storybook and in app, and for those who come after me, I found that storybook has now provided a feature flag to avoid clashing with later versions of emotion: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#emotion11-quasi-compatibility I tested it and it works well to prevent emotion version-out-of-sync problems in storybook, and is a 3 line change.

See the bottom of https://github.com/storybookjs/storybook/issues/13145 for more details

@GriffinSauce , I didn’t follow up because I’m ashamed of my solution.

Following @shilman 's suggestion, I dug around in my dependencies under the assumption that there were inconsistent versions of either emotion or react. I read the yarn.lock file looking for versions of them, and noticed a few cases where it was resolving counterintuitively: emotion ^10.1 would resolve to emotion 10.3, but emotion ^10.2 resolved to emotion 10.2.

I simply removed those from the yarn.lock (Warning: you aren’t supposed to hand-edit yarn.lock. It makes the maintainers sad) and then reran yarn.

This maintained most of my various package versions, but got rid of a metric ton of crud. Fewer versions of @emotion/core and @babel/runtime and react-foo floating around.

This didn’t break anything, and seemed to work well enough.

Great idea @GriffinSauce ! Would you mind contributing a PR for that?

That indeed did it. A little updating of dependencies seemed to clear it up. Thanks!

Thanks, it’s been a ton of fun! 🙏

I’m certain that the issue is due to some kind of conflict, either react or emotion. With a repro we might be able to fiddle with it and see what kind of webpack resolutions voodoo we might need to do to get it fixed. But honestly this stuff is really confusing and I’m not even sure a repro would help – more likely you’d get it figured out yourself trying to disentangle from the monorepo… Wish I had a magic bullet for this!

Ouch. Not really – it’s our core prod, and we’re a monorepo. I could possibly try to split off pieces. Or share our yarn.lock or something.

Also, hey @shilman ! I’d meant to send you a wave at some point – storybook is awesome, and I’m so glad you’re making it happen!

Strange as it is to say, I’m coming in a full year later for upgrading to v6 (!) and seeing the same sorts of errors. Any ways that I can deliver diagnostics against our weird little codebase?

@jdelStrother contact me directly on our discord if the issue persists, so maybe we can debug together.

@ndelangen I’m getting this error when running rc.5 against the example above:

WARN FATAL broken build!, will close the process,
WARN Fix the error below and restart storybook.

EntryModuleNotFoundError: Entry module not found: Error: Can't resolve './src' in '/Users/shilman/projects/storybook/testing/storybook-missing-theme'
    at moduleFactory.create (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/webpack/lib/Compilation.js:980:31)
    at factory (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/webpack/lib/NormalModuleFactory.js:397:22)
    at resolver (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/webpack/lib/NormalModuleFactory.js:130:21)
    at asyncLib.parallel (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/webpack/lib/NormalModuleFactory.js:224:22)
    at /Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/neo-async/async.js:2825:7
    at /Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/neo-async/async.js:6886:13
    at normalResolver.resolve (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/webpack/lib/NormalModuleFactory.js:214:25)
    at doResolve (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/enhanced-resolve/lib/Resolver.js:184:12)
    at hook.callAsync (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/enhanced-resolve/lib/Resolver.js:238:5)
    at _fn0 (eval at create (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/tapable/lib/HookCodeFactory.js:32:10), <anonymous>:15:1)
    at resolver.doResolve (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:37:5)
    at hook.callAsync (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/enhanced-resolve/lib/Resolver.js:238:5)
    at _fn0 (eval at create (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/tapable/lib/HookCodeFactory.js:32:10), <anonymous>:15:1)
    at hook.callAsync (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/enhanced-resolve/lib/Resolver.js:238:5)
    at _fn0 (eval at create (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/tapable/lib/HookCodeFactory.js:32:10), <anonymous>:12:1)
    at resolver.doResolve (/Users/shilman/projects/storybook/testing/storybook-missing-theme/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:42:38)
resolve './src' in '/Users/shilman/projects/storybook/testing/storybook-missing-theme'
  using description file: /Users/shilman/projects/storybook/testing/storybook-missing-theme/package.json (relative path: .)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: /Users/shilman/projects/storybook/testing/storybook-missing-theme/package.json (relative path: ./src)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        /Users/shilman/projects/storybook/testing/storybook-missing-theme/src is not a file
      .wasm
        Field 'browser' doesn't contain a valid alias configuration
        /Users/shilman/projects/storybook/testing/storybook-missing-theme/src.wasm doesn't exist
      .mjs
        Field 'browser' doesn't contain a valid alias configuration
        /Users/shilman/projects/storybook/testing/storybook-missing-theme/src.mjs doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        /Users/shilman/projects/storybook/testing/storybook-missing-theme/src.js doesn't exist
      .json
        Field 'browser' doesn't contain a valid alias configuration
        /Users/shilman/projects/storybook/testing/storybook-missing-theme/src.json doesn't exist
      as directory
        existing directory
          using path: /Users/shilman/projects/storybook/testing/storybook-missing-theme/src/index
            using description file: /Users/shilman/projects/storybook/testing/storybook-missing-theme/package.json (relative path: ./src/index)
              no extension
                Field 'browser' doesn't contain a valid alias configuration
                /Users/shilman/projects/storybook/testing/storybook-missing-theme/src/index doesn't exist
              .wasm
                Field 'browser' doesn't contain a valid alias configuration
                /Users/shilman/projects/storybook/testing/storybook-missing-theme/src/index.wasm doesn't exist
              .mjs
                Field 'browser' doesn't contain a valid alias configuration
                /Users/shilman/projects/storybook/testing/storybook-missing-theme/src/index.mjs doesn't exist
              .js
                Field 'browser' doesn't contain a valid alias configuration
                /Users/shilman/projects/storybook/testing/storybook-missing-theme/src/index.js doesn't exist
              .json
                Field 'browser' doesn't contain a valid alias configuration
                /Users/shilman/projects/storybook/testing/storybook-missing-theme/src/index.json doesn't exist
error Command failed with exit code 1.

@jdelStrother Ok just reproduced in a different test project. Try removing yarn.lock and node_modules and reinstalling. We’ve been seeing a lot of yarn issues lately and I suspect this is one. Please let me know if that works. It’s not a very satisfying solution, but at least it will help us get closer to understanding what’s going on.