Storybook: @storybook/vue v6.1.x build failure

Created on 22 Nov 2020 · 23Comments · Source: storybookjs/storybook

Describe the bug
After upgrading from 6.0.28 to 6.1.2 (also tried with 6.1.0) results in a build failure.

To Reproduce
Steps to reproduce the behavior:

Upgrade from 6.0.28 to 6.1.2
Packages
"@storybook/addon-viewport": "6.1.2",
"@storybook/addon-actions": "6.1.2",
"@storybook/addon-docs": "6.1.2",
"@storybook/addon-knobs": "6.1.2",
"@storybook/addon-links": "6.1.2",
"@storybook/addon-storysource": "6.1.2",
"@storybook/addons": "6.1.2",
"@storybook/vue": "6.1.2",
run yarn storybook
See "Code Snippets"
Error in browser: Cannot GET /

Code snippets

$ yarn storybook
yarn run v1.22.5
$ start-storybook -s ./public -s ./dist -p 6006
info @storybook/vue v6.1.2
info
info => Loading static files from: /Users/[local-path]/dist and serving at / .
info => Loading presets
info => Loading presets
WARN   Failed to load preset: "/Users/[local-path]/node_modules/@storybook/core/dist/server/manager/manager-preset.js"
ERR! Error: Cannot find module 'react-dom/package.json'
ERR! Require stack:
ERR! - /Users/[local-path]/node_modules/@storybook/ui/noop.js
ERR! - ...
...
info => Loading 1 config file in "./.storybook"
info => Loading 6 other files in "./.storybook"
info => Adding stories defined in ".storybook/main.js"
ERR! TypeError: Cannot read property 'publicPath' of undefined
ERR!     at startManager (/Users/[local-path]/node_modules/@storybook/core/dist/server/dev-server.js:324:38)
ERR!     at async Promise.all (index 1)
...
WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

info => Using default Webpack setup
...
[./node_modules/@storybook/core/dist/server/preview/globals.js] 93 bytes {vendors~main} [built]
[./node_modules/webpack-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined] (webpack)-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined 7.68 KiB {vendors~main} [built]
    + 1974 hidden modules

ERROR in ./node_modules/@storybook/core/dist/client/preview/StoryRenderer.js
Module not found: Error: Can't resolve 'react-dom' in '/Users/[local-path]/node_modules/@storybook/core/dist/client/preview'
...
ERROR in ./node_modules/react-popper-tooltip/dist/esm/react-popper-tooltip.js
Module not found: Error: Can't resolve 'react-dom' in '/Users/[local-path]/node_modules/react-popper-tooltip/dist/esm'
...

System

Environment Info:

  System:
    OS: macOS 10.15.7
    CPU: (8) x64 Intel(R) Core(TM) i7-6700HQ CPU @ 2.60GHz
  Binaries:
    Node: 12.18.2 - /usr/local/bin/node
    Yarn: 1.22.5 - /usr/local/bin/yarn
    npm: 6.14.8 - /usr/local/bin/npm
  Browsers:
    Chrome: 87.0.4280.67
    Firefox: 82.0.3
    Safari: 14.0.1
  npmPackages:
    @storybook/addon-actions: 6.1.2 => 6.1.2
    @storybook/addon-docs: 6.1.2 => 6.1.2
    @storybook/addon-knobs: 6.1.2 => 6.1.2
    @storybook/addon-links: 6.1.2 => 6.1.2
    @storybook/addon-storysource: 6.1.2 => 6.1.2
    @storybook/addon-viewport: 6.1.2 => 6.1.2
    @storybook/addons: 6.1.2 => 6.1.2
    @storybook/vue: 6.1.2 => 6.1.2

P1 vue bug core needs reproduction

Source

scheinercc

All 23 comments

Do you have a repro repo you can share?

shilman on 22 Nov 2020

Do you have a repro repo you can share?

No, it's not public. Sorry.

scheinercc on 22 Nov 2020

Same on version 6.1.2.
My app worked fine last Friday, but not today.

WARN   Failed to load preset: "/Users/husiyuan/dev/my-app/node_modules/_@[email protected]@@storybook/core/dist/server/manager/manager-preset.js"
ERR! Error: Cannot find module 'react/package.json'
ERR! Require stack:
ERR! - /Users/husiyuan/dev/my-app/node_modules/_@[email protected]@@storybook/ui/noop.js
ERR!     at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
ERR!     at resolveFileName (/Users/husiyuan/dev/my-app/node_modules/[email protected]@resolve-from/index.js:29:39)
ERR!     at resolveFrom (/Users/husiyuan/dev/my-app/node_modules/[email protected]@resolve-from/index.js:43:9)
ERR!     at module.exports (/Users/husiyuan/dev/my-app/node_modules/[email protected]@resolve-from/index.js:46:47)
ERR!     at Object.<anonymous> (/Users/husiyuan/dev/my-app/node_modules/_@[email protected]@@storybook/ui/paths.js:17:18)
ERR!     at Module._compile (internal/modules/cjs/loader.js:1063:30)
ERR!     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
ERR!     at Module.load (internal/modules/cjs/loader.js:928:32)
ERR!     at Function.Module._load (internal/modules/cjs/loader.js:769:14)
ERR!     at Module.require (internal/modules/cjs/loader.js:952:19)
ERR!     at require (internal/modules/cjs/helpers.js:88:18)
ERR!     at Object.<anonymous> (/Users/husiyuan/dev/my-app/node_modules/_@[email protected]@@storybook/core/dist/server/manager/manager-webpack.config.js:34:38)
ERR!     at Module._compile (internal/modules/cjs/loader.js:1063:30)
ERR!     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
ERR!     at Module.load (internal/modules/cjs/loader.js:928:32)
ERR!     at Function.Module._load (internal/modules/cjs/loader.js:769:14)
ERR!  Error: Cannot find module 'react/package.json'

HytonightYX on 23 Nov 2020

storybook
"@storybook/addon-essentials": "6.1.2",
"@storybook/addons": "6.1.2",
"@storybook/react": "6.1.2",
"@storybook/theming": "6.1.2"

MacOS Big Sur 11.0.1

HytonightYX on 23 Nov 2020

I was on storybook 6.0.28 and I had a message that the 6.1.3 was available.
I've executed the upgrade command and have exactly the same error when starting storybook. I'm using react though.
I tried to remove node_modules and install again and the problem was still here.
Dowgrading to 6.0.28 fixed issues

nohira on 23 Nov 2020

Did you try removing node_modules and/or lockfiles and reinstalling?

shilman on 23 Nov 2020

In my case, I just removed node_modules folder as I didn't want having other packages being updated. Just wanted to see performance improuvment

nohira on 23 Nov 2020

Great Caesar's ghost!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.1.4 containing PR #13230 that references this issue. Upgrade today to the @latest NPM tag to try it out!

npx sb upgrade

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

shilman on 24 Nov 2020

@shilman I'm not sure if this requires a new issue or re-opening this one, but I had the same problem as the author except in React (@storybook/[email protected]). When I ran npx sb upgrade, moving to @storybook/[email protected], I now see the following when running start-storybook:

✖ ｢wdm｣: Hash: 99602bd3a64e5e0dd377
Version: webpack 4.44.2
Time: 412ms
Built at: 11/23/2020 9:17:38 PM

WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/

ERROR in Entry module not found: Error: Can't resolve './src' in '/Users/michaelflores/workspace/video-client/stories'
10% building 1/1 modules 0 activeWARN Force closed preview build

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

34% building 202/230 modules 28 active /Users/michaelflores/workspace/video-client/stories/node_modules/@storybook/addons/dist/index.jsts-loader: Using [email protected]. This version may or may not be compatible with ts-loader.
94% after seal

It seems to get stuck at 94% and not move from there.

It's rather unclear where the source of this issue is as I don't reference "./src" in my stories, although it's also unclear why this patch upgrade should throw an error in existing code (although perhaps something was fixed that exposed a hidden bug..?).

michaelaflores on 24 Nov 2020

@shilman Sorry for being the bearer of bad news, but I still have the same problem.

Upgraded to 6.1.4
Deleted node_modules and yarn.lock
reinstalled everything

Error still occurs ERR! Error: Cannot find module 'react-dom/package.json' as my description above.

And it now also got stuck at 94% as @michaelaflores mentioned.

Reverting to v6.0.28 fixes it.

scheinercc on 24 Nov 2020

I ran npx sb upgrade， I now see the following when running start-storybook:

ERROR in ./.storybook/preview.js-generated-config-entry.js
Module not found: Error: Can't resolve 'core-js/modules/es6.array.iterator' in 'H:\work\test\front\fingard-react-ui\.storybook'
 @ ./.storybook/preview.js-generated-config-entry.js 27:0-45
 @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/storybook-init-framework-entry.js ./node_modules/@storybook/addon-docs/dist/frameworks/common/config.js-generated-other-entry.js ./node_modules/@storybook/addon-docs/dist/frameworks/react/config.js-generated-other-entry.js ./node_modules/@storybook/addon-links/dist/preset/addDecorator.js-generated-other-entry.js ./node_modules/@storybook/addon-actions/dist/preset/addDecorator.js-generated-other-entry.js ./node_modules/@storybook/addon-actions/dist/preset/addArgs.js-generated-other-entry.js ./node_modules/@storybook/addon-backgrounds/dist/preset/addDecorator.js-generated-other-entry.js ./node_modules/@storybook/addon-backgrounds/dist/preset/addParameter.js-generated-other-entry.js ./.storybook/preview.js-generated-config-entry.js ./.storybook/generated-stories-entry.js (webpack)-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined

ERROR in ./node_modules/@storybook/addon-docs/node_modules/acorn-jsx/index.js
Module not found: Error: Can't resolve 'core-js/modules/es6.array.iterator' in 'H:\work\test\front\fingard-react-ui\node_modules\@storybook\addon-docs\node_modules\acorn-jsx'
.......

huangxinxia on 25 Nov 2020

@scheinercc Can you upgrade and try again npx sb upgrade

shilman on 25 Nov 2020

🎉1

Works like a charm! Thanks a lot

scheinercc on 25 Nov 2020

🎉1

same here

System:
OS: macOS Mojave 10.14.6
CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
Binaries:
Node: 14.13.0 - ~/.nvm/versions/node/v14.13.0/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 6.14.8 - ~/.nvm/versions/node/v14.13.0/bin/npm
Browsers:
Chrome: 73.0.3683.86
Firefox: 83.0
Safari: 14.0.1
npmPackages:
@storybook/addon-actions: ^6.1.6 => 6.1.6
@storybook/addon-essentials: ^6.1.6 => 6.1.6
@storybook/addon-links: ^6.1.6 => 6.1.6
@storybook/react: ^6.1.6 => 6.1.6

jonwilliams-bluescape on 25 Nov 2020

I think mine is a peer dependency issue. Not sure how to resolve it.

jonwilliams-bluescape on 25 Nov 2020

@jonwilliams-bluescape you're still seeing this bug?

shilman on 26 Nov 2020

@shilman I'm running into the same problem. I've tried clearing node_modules, package-lock.json and yarn.lock and then when I run storybook, I get this:

yarn run v1.19.1
warning package.json: No license field
$ start-storybook --port 3000
info @storybook/react v6.1.6
info
info => Loading presets
info => Loading presets
WARN   Failed to load preset: "./node_modules/@storybook/core/dist/server/manager/manager-preset.js"
ERR! Error: Cannot find module 'react/package.json'
ERR! Require stack:
ERR! - ./node_modules/@storybook/ui/noop.js
ERR!     at Function.Module._resolveFilename (internal/modules/cjs/loader.js:965:15)
ERR!     at resolveFileName (./node_modules/resolve-from/index.js:29:39)
ERR!     at resolveFrom (./node_modules/resolve-from/index.js:43:9)
ERR!     at module.exports (./node_modules/resolve-from/index.js:46:47)
ERR!     at Object.<anonymous> (./node_modules/@storybook/ui/paths.js:17:18)
ERR!     at Module._compile (internal/modules/cjs/loader.js:1137:30)
ERR!     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1157:10)
ERR!     at Module.load (internal/modules/cjs/loader.js:985:32)
ERR!     at Function.Module._load (internal/modules/cjs/loader.js:878:14)
ERR!     at Module.require (internal/modules/cjs/loader.js:1025:19)
ERR!     at require (internal/modules/cjs/helpers.js:72:18)
ERR!     at Object.<anonymous> (./node_modules/@storybook/core/dist/server/manager/manager-webpack.config.js:34:38)
ERR!     at Module._compile (internal/modules/cjs/loader.js:1137:30)
ERR!     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1157:10)
ERR!     at Module.load (internal/modules/cjs/loader.js:985:32)
ERR!     at Function.Module._load (internal/modules/cjs/loader.js:878:14)

and ends with

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

✖ ｢wdm｣: Hash: d7cf1de00d1837717bff
Version: webpack 4.44.2
Time: 25ms
Built at: 11/26/2020 14:21:31

WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/

ERROR in Entry module not found: Error: Can't resolve './src' in './clinical-code-entry'

(I've edited folder names)

maheshjag on 26 Nov 2020

👍1

@jonwilliams-bluescape you're still seeing this bug?

I moved my storybook setup inside one of the packages in our mono repo (per the engineer who manages the build and such) and the issue went away. I’d been attempting from the project root.

jonwilliams-bluescape on 26 Nov 2020

happening again with 6.1.7

jonwilliams-bluescape on 27 Nov 2020

adding react and react-dom to our peer dependencies seems to have solved the issue
(Also, to be clear we're NOT a vue project as the issue title would suggest)

jonwilliams-bluescape on 27 Nov 2020

Running into the identical issue as @maheshjag reverting to 6.0.7 got me back up and running

fullsnackdeveloper on 3 Dec 2020

Does anybody have a repro repo they can share?

shilman on 4 Dec 2020

@shilman I can't share unfortunately, as the repo is a private one. However, I could share the list of other packages that are used in the project, if that's of any use?

maheshjag on 5 Dec 2020

Was this page helpful?

0 / 5 - 0 ratings