How to make webpack less verbose?

You can use Webpack CLI's --display option to set the verbosity of the stats output. Here are the available values.

E.g.

--display=minimal

You can add --quiet and --no-info to webpack-dev-server's command line: http://webpack.github.io/docs/webpack-dev-server.html#webpack-dev-server-cli

If you use webpack in watch mode, you can put | awk '{if ($0 !~ /^ *\[[0-9]*\]/) {print} else {if ($0 ~ /\[built\]/) {print}}}' after it, which will print all output except files that were not rebuilt.


Use webpack's stats options.

For example, to remove the hundreds of lines generated by chunks:

stats: {
    chunks: false
}

To remove information about modules:

stats: {
    chunkModules: false
}

See the stats documentation for many more options.


From webpack docs:

The stats option lets you precisely control what bundle information gets displayed. This can be a nice middle ground if you don't want to use quiet or noInfo because you want some bundle information, but not all of it.

For webpack-dev-server, this property needs to be in the devServer object.

//example with module.exports in webpack.config.js
module.exports = {
  //...
  stats: 'minimal'
};

//example with dev-sever in webpack.config.js
dev-sever: {
  //...
  stats: 'minimal'
}

See docs for other options including errors-only, none, verbose and more.

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