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.

No webpack config for `build-storybook --debug-webpack`

See original GitHub issue

Describe the bug

Hi I can’t see any debug webpack output despite the option in the build-storybook --help section:

--debug-webpack     Display final webpack configurations for debugging purposes

It’s never displayed and there’s no txt log in the output directory either…

❯ npx build-storybook --debug-webpack
info @storybook/react v6.3.4
info 
info => Cleaning outputDir: /repo/storybook-static
info => Loading presets
info => Compiling preview..
info => Loading 1 config file in "/repo/.storybook"
info => Loading 9 other files in "/repo/.storybook"
info => Adding stories defined in "/repo/.storybook/main.js"
info => Using implicit CSS loaders
info => Using default Webpack4 setup
10% building 1/1 modules 0 active(node:41651) DeprecationWarning: Default PostCSS plugins are deprecated. When switching to '@storybook/addon-postcss',
you will need to add your own plugins, such as 'postcss-flexbugs-fixes' and 'autoprefixer'.

See https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-default-postcss-plugins for details.
(Use `node --trace-deprecation ...` to show where the warning was created)
info => Preview built (16 s)
WARN asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
WARN This can impact web performance.
WARN Assets: 
WARN   vendors~main.9bba21ad.iframe.bundle.js (3.29 MiB)
WARN entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
WARN Entrypoints:
WARN   main (3.34 MiB)
WARN       runtime~main.d69e7d63.iframe.bundle.js
WARN       vendors~main.9bba21ad.iframe.bundle.js
WARN       main.36ab2da7.iframe.bundle.js
WARN 
info => Output directory: /repo/storybook-static**To Reproduce**


> npx sb@next repro

> cd reprodir

> npx build-storybook --help
Usage: build-storybook [options]

Options:
  -V, --version                     output the version number
  -s, --static-dir <dir-names>      Directory where to load static files from
  -o, --output-dir <dir-name>       Directory where to store built files
  -c, --config-dir <dir-name>       Directory where to load Storybook configurations from
  -w, --watch                       Enable watch mode
  --quiet                           Suppress verbose build output
  --loglevel <level>                Control level of logging during build
  --no-dll                          Do not use dll reference (no-op)
  --docs-dll                        Use Docs dll reference (legacy)
  --ui-dll                          Use UI dll reference (legacy)
  --debug-webpack                   Display final webpack configurations for debugging purposes
  --webpack-stats-json [directory]  Write Webpack Stats JSON to disk
  --preview-url <string>            Disables the default storybook preview and lets your use your own
  --force-build-preview             Build the preview iframe even if you are using --preview-url
  --docs                            Build a documentation-only site using addon-docs
  --modern                          Use modern browser modules
  -h, --help                        display help for command

> npx build-storybook --debug-webpack
info @storybook/react v6.4.0-alpha.17
info
info => Cleaning outputDir: /private/tmp/reprodir/storybook-static
info => Loading presets
info => Compiling preview..
info => Loading 1 config file in "/private/tmp/reprodir/.storybook"
info => Loading 9 other files in "/private/tmp/reprodir/.storybook"
info => Adding stories defined in "/private/tmp/reprodir/.storybook/main.js"
info => Using implicit CSS loaders
info => Using default Webpack4 setup
10% building 1/1 modules 0 active(node:42567) DeprecationWarning: Default PostCSS plugins are deprecated. When switching to '@storybook/addon-postcss',
you will need to add your own plugins, such as 'postcss-flexbugs-fixes' and 'autoprefixer'.

See https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-default-postcss-plugins for details.
(Use `node --trace-deprecation ...` to show where the warning was created)
info => Preview built (13 s)
WARN asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
WARN This can impact web performance.
WARN Assets:
WARN   vendors~main.2e20dc6c.iframe.bundle.js (1.96 MiB)
WARN entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
WARN Entrypoints:
WARN   main (2 MiB)
WARN       runtime~main.cdb6c1c3.iframe.bundle.js
WARN       vendors~main.2e20dc6c.iframe.bundle.js
WARN       main.b83cef95.iframe.bundle.js
WARN
info => Output directory: /private/tmp/reprodir/storybook-static**System**
Environment Info:

  System:
    OS: macOS 11.4
    CPU: (8) x64 Intel(R) Core(TM) i5-1038NG7 CPU @ 2.00GHz
  Binaries:
    Node: 16.3.0 - /usr/local/bin/node
    Yarn: 2.4.2 - /usr/local/bin/yarn
    npm: 7.15.1 - /usr/local/bin/npm
  Browsers:
    Firefox: 89.0
    Safari: 14.1.1
  npmPackages:
    @storybook/addon-actions: ^6.4.0-alpha.17 => 6.4.0-alpha.17
    @storybook/addon-docs: ^6.4.0-alpha.17 => 6.4.0-alpha.17
    @storybook/addon-essentials: ^6.4.0-alpha.17 => 6.4.0-alpha.17
    @storybook/addon-links: ^6.4.0-alpha.17 => 6.4.0-alpha.17
    @storybook/react: ^6.4.0-alpha.17 => 6.4.0-alpha.17

Additional context Add any other context about the problem here.

It works for storybook --debug-webpack but that’s not the webpack config I’m interested in. That’s a dev-server development config but I want the production static build config…

Thank you!

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
shilmancommented, Jul 26, 2021

Olé!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.3.6 containing PR #15674 that references this issue. Upgrade today to the @latest NPM tag to try it out!

npx sb upgrade
1reaction
shilmancommented, Jul 26, 2021

Boo-yah!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.4.0-alpha.21 containing PR #15674 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.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Webpack - Storybook
Storybook displays your components in a custom web application built using Webpack. Webpack is a complex tool, but our default configuration is intended...
Read more >
No webpack config for `build-storybook --debug ... - Issuehunt
Describe the bug. Hi I can't see any debug webpack output despite the option in the build-storybook --help section: --debug-webpack Display final webpack...
Read more >
Custom Webpack Config - Storybook
You can customize Storybook's webpack setup by providing a webpack.config.js file exporting a webpack 4 compatible config exported as a commonjs module.
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 >
React Storybook deploy fails during Webpack build - Support
icon.svg' is part of the Create React App webpack setup, but I'm not sure why ... My build command looks like this: "build-storybook":...
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