storybookjs / storybook

Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation
https://storybook.js.org
MIT License
84.21k stars 9.26k forks source link

Webpack devServer config and log verbose #12539

Open rdhainaut opened 4 years ago

rdhainaut commented 4 years ago

Describe the bug I have try to reduce the amount of log in console (from addon-docs) So i have configure webpack devServer option to print only errors (and not chunk informations) I have read the webpack dock https://webpack.js.org/configuration/dev-server/ to configure log level Indeed, when a error occured in my project i have all chunk information in my console. Unfortunately docs addon include a lot of react syntax highlighter chunk. So my console try to log at each save all that information that is useless for me. It s painfull (30 seconds of logs for each error)

To Reproduce Steps to reproduce the behavior:

  1. Go to .config/main.js
  2. Edit config webpackFinal node

Expected behavior I m expecting to see only errors in console and not all verbose information

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

Code snippets

module.exports = {
  stories: ["../../stories/**/*.stories.(ts|mdx)"],

  addons: [
    {
      name: "@storybook/addon-docs",
      options: {
        babelOptions: {
          presets: [
            [
              "@vue/cli-plugin-babel/preset",
              {
                jsx: false
              }
            ]
          ]
        }
      }
    }
  ],
  logLevel: "error",
  webpackFinal: async (config, { configType }) => {
    config.devServer = {
      quiet: true,
      stats: "errors-only",
      noInfo: true
    };

    // Return the altered config
    return config;
  }
};

System: System: OS: Windows 10 10.0.18363 CPU: (8) x64 Intel(R) Core(TM) i7-6820HQ CPU @ 2.70GHz Binaries: Node: 12.16.3 - C:\Program Files\nodejs\node.EXE Yarn: 1.13.0 - ~\AppData\Roaming\npm\yarn.CMD npm: 6.14.1 - C:\Program Files\nodejs\npm.CMD Browsers: Chrome: 85.0.4183.102 Edge: Spartan (44.18362.449.0) npmPackages: @storybook/addon-a11y: ^6.0.21 => 6.0.21 @storybook/addon-actions: ^6.0.21 => 6.0.21 @storybook/addon-backgrounds: ^6.0.21 => 6.0.21 @storybook/addon-centered: ^5.3.21 => 5.3.21 @storybook/addon-contexts: ^5.3.21 => 5.3.21 @storybook/addon-docs: ^6.0.21 => 6.0.21 @storybook/addon-knobs: ^6.0.21 => 6.0.21 @storybook/addon-links: ^6.0.21 => 6.0.21 @storybook/addon-viewport: ^6.0.21 => 6.0.21 @storybook/vue: ^6.0.21 => 6.0.21 npmGlobalPackages: @storybook/cli: 5.0.11

Additional context I don t know if it s important but i m working in vue project. I have try many things and i don t know how to fix that. Any help is welcome.

natemwilson commented 1 year ago

Add something like:

stats: 'minimal',

to your module.exports.

https://webpack.js.org/configuration/stats/