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.

Webpack5: Addons throw error on start

See original GitHub issue

Describe the bug After updating to use the webpack5 builder with Storybook 6.2.0-beta.1 running storybook-start builds successfully but after opening the tab, there is a loading spinner with error.

Uncaught (in promise) RangeError: Maximum call stack size exceeded
    at Object.exports.deprecate (vendors-node_modules_storybook_addon-a11y_dist_esm_register_js-node_modules_storybook_addon-a-4deea9.b4c677ad3a67aca938fd.bundle.js:126199)

Seems to also happen from the other addons when I start disabling some.

To Reproduce Steps to reproduce the behavior:

  1. Use Webpack5 builder (followed this example repo)
  2. Run storybook-start
  3. Notice error in the console

Expected behavior Addons work as expected.

Screenshots If applicable, add screenshots to help explain your problem.

Code snippets If applicable, add code samples to help explain your problem.

System

Environment Info:

  System:
    OS: macOS 10.15.7
    CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
  Binaries:
    Node: 14.15.1 - ~/.nvm/versions/node/v14.15.1/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 6.14.11 - ~/.nvm/versions/node/v14.15.1/bin/npm
  Browsers:
    Chrome: 89.0.4389.82
    Edge: 88.0.705.63
    Firefox: 86.0
    Safari: 14.0.3
  npmPackages:
    @storybook/addon-a11y: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/addon-actions: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/addon-controls: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/addon-docs: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/addon-postcss: ^2.0.0 => 2.0.0 
    @storybook/addon-storysource: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/addon-viewport: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/addons: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/builder-webpack5: 6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/react: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/source-loader: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/theming: ^6.2.0-beta.1 => 6.2.0-beta.1 
    @storybook/web-components: ^6.2.0-beta.1 => 6.2.0-beta.1 

Additional context Add any other context about the problem here.

┆Issue is synchronized with this Asana task by Unito

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:19 (8 by maintainers)

github_iconTop GitHub Comments

1reaction
shilmancommented, Apr 6, 2021

Awesome. I bet that was it! Closing this for now.

0reactions
Niznikrcommented, Apr 6, 2021

@shilman Not sure what changed (perhaps the ESM file-loader fix?) but upgrading from 6.2.0-rc.3 to 6.2.3 seems to fix things and this snippet now works as expected:

import pkg from '../packages/core/package.json';

const DS_TITLE = `Design System ${pkg.version}`;

export default DS_TITLE;
Read more comments on GitHub >

github_iconTop Results From Across the Web

Webpack 5 and Storybook 6 integration throws an error in ...
Basically the error is coming from the marked line in /node_modules/webpack/lib/DefinePlugin.js once running for the first time npm run ...
Read more >
How I solved and debugged my Webpack issue through ...
When webpack bundles your source code, it can become difficult to track down errors and warnings to their original location.
Read more >
EslintWebpackPlugin
To begin, you'll need to install eslint-webpack-plugin : npm install eslint-webpack-plugin --save-dev ... File and glob patterns ignore options.extensions .
Read more >
A mostly complete guide to webpack 5 (2020)
Loaders are third-party extensions that help webpack deal with various file ... Now run again npm run dev and you should see no...
Read more >
Serverless Webpack
A Serverless Framework plugin to build your lambda functions with Webpack. ... An error will be thrown if you are trying to override...
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