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.

React @storybook/builder-vite `build-storybook` fails for `v6.5.12`

See original GitHub issue

Describe the bug

build-storybook fails with the following message

[vite]: Rollup failed to resolve import "window" from "node_modules/@storybook/channel-postmessage/dist/esm/index.js".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`

Please note that yarn storybook for local development runs without any problem. Only the prod build with build-storybook fails.

build.rollupOptions.extenal is added in vite.config.js - https://github.com/palerdot/react-d3-speedometer/commit/eb613b8e740d6157a8d38bdf5e40bd6bdc9addaf

To Reproduce

Repository/branch to reproduce - https://github.com/palerdot/react-d3-speedometer/tree/react-v18 Please note the branch name to reproduce is react-v18 which has latest 6.5.12 version. Please note, I have shared the public repository/branch instead of storybook way of creating a repo for reproduction. This is because, I have classic yarn installed and npx sb@next repro fails in my machine for unknown reason.

System

System:
    OS: macOS 12.5
    CPU: (4) x64 Intel(R) Core(TM) i5-5250U CPU @ 1.60GHz
  Binaries:
    Node: 16.13.0 - ~/.nvm/versions/node/v16.13.0/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v16.13.0/bin/yarn
    npm: 8.5.2 - ~/.nvm/versions/node/v16.13.0/bin/npm
  Browsers:
    Chrome: 106.0.5249.61
    Firefox: 105.0.1
    Safari: 15.6
  npmPackages:
    @storybook/addon-actions: ^6.5.12 => 6.5.12
    @storybook/addon-docs: ^6.5.12 => 6.5.12
    @storybook/addon-essentials: ^6.5.12 => 6.5.12
    @storybook/addon-info: ^6.0.0-alpha.2 => 6.0.0-alpha.2
    @storybook/addon-interactions: ^6.5.12 => 6.5.12
    @storybook/addon-knobs: ^6.4.0 => 6.4.0
    @storybook/addon-links: ^6.5.12 => 6.5.12
    @storybook/addon-storysource: ^6.5.12 => 6.5.12
    @storybook/builder-vite: ^0.2.3 => 0.2.3
    @storybook/react: ^6.5.12 => 6.5.12
    @storybook/testing-library: ^0.0.13 => 0.0.13
    @storybook/theming: ^6.5.12 => 6.5.12

Additional context Please note, I’m sharing my public repository and branch for reproduction as storybook reproduction messes with my local yarn 1.x installation.

Issue Analytics

  • State:open
  • Created a year ago
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
pwang2commented, Nov 29, 2022

I think I have figured out why. The problematic project was a monorepo project and when i created it preview-head.html was not added, so in start-storybook run, it throws error and some google search points me to modify viteConfig as below which creates some problem in build-storybook run.

image

0reactions
pwang2commented, Nov 29, 2022

I didn’t have anything fancy yet, just the stories from the boilerplate. Start-storybook is okay and only throw when run build-storybook. “@storybook/builder-vite”: “^0.2.5”, “@storybook/vue3”: “^6.5.13”,

Read more comments on GitHub >

github_iconTop Results From Across the Web

React @storybook/builder-vite `build-storybook` fails for `v6 ...
Describe the bug. build-storybook fails with the following message [vite]: Rollup failed to resolve import "window" from ...
Read more >
npm run build-storybook fails with "Module parse failed
By default the react template uses a webpack config which is in a different directory. Replacing the build directory app by stories fixed...
Read more >
@storybook/builder-vite - npm
Migration from webpack / CRA. Install vite and @storybook/builder-vite; Remove any explicit project dependencies on webpack , react- ...
Read more >
Publish Storybook
First, we'll need to build Storybook as a static web application. The functionality is already built-in and pre-configured for most supported frameworks.
Read more >
storybook - Github Plus
[v7] Failed to load preset: "@storybook/react/preset" ERR! ... build-storybook > xxx@0.1.0 build-storybook > build-storybook info @storybook/react v6.5.12 ...
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