Webpack：静音输出

Question

我想知道是否有配置选项告诉 webpack 只将 "important information" 记录到终端。几乎只是错误和警告，并非全部：

输出这么多！很想压制常见的东西，只让 webpack 输出 warnings/errors。想要 webpack、webpack-dev-server 和 karma-webpack.

的解决方案

注意：我尝试了noInfo: true和quiet: true，但似乎没有用。

编辑： 我认为这不可能，所以我在 github 上创建了一个问题：https://github.com/webpack/webpack/issues/1191

Answer 1

我不知道这个功能是什么时候添加的，但我只是注意到在 the docs 中你可以添加一个 webpackMiddleware 属性并且你可以在上面指定 noInfo: true.这样做可以消除所有噪音！但是当出现错误时，您仍然会看到输出。耶！

Answer 2

如果您使用 webpack-dev-middleware，您可以将 noInfo: true 作为第二个参数放入对象中。 同时假设您也有一个 node/express 服务器运行。

干杯。

Answer 3

如果你直接使用 Webpack API，并且你正在调用 stats.toString()，那么你可以传递参数来降低噪声：

webpack(config).watch(100, (err, stats) => {
  console.log(stats.toString({chunks: false}))
})

Answer 4

在我的 webpack 配置中，这样做将我的增量构建时间减少了 8 秒并使输出静音。主要是chunks: false

根据您的需要使用它

module.exports = {
 devServer: {
  stats: {
    colors: true,
    hash: false,
    version: false,
    timings: false,
    assets: false,
    chunks: false,
    modules: false,
    reasons: false,
    children: false,
    source: false,
    errors: false,
    errorDetails: false,
    warnings: false,
    publicPath: false
  }
 }
}

Answer 5

You don't need all that. All you need is the

实际上，这两个很好用。

stats: 'errors-only',

在导出对象的末尾。

也可以使用 stats: 'minimal', 它仅在发生错误或新编译时输出。从 official documentation of Webpack.

阅读更多内容

Answer 6

推荐下面的统计配置，这将保留重要的日志并删除无用的信息。

stats: {
  cached: false,
  cachedAssets: false,
  chunks: false,
  chunkModules: false,
  chunkOrigins: false,
  modules: false
}

Answer 7

Webpack

  ...
  stats: {
    modules: false,
  },
  ...

开发服务器

  ...
  devServer: {
    stats: {
      modules: false,
    },
  },
  ...

参考

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

Answer 8

您有 --display 选项，可让您选择要显示的信息量级别。

来自webpack --help：

--display: Select display preset
[string] [choices: "", "verbose", "detailed", "normal", "minimal", "errors-only", "none"]

如果你想配置更精确显示的信息，你也可以在你的webpack.config.js.

中使用stats字段配置你的webpack

Answer 9

您感兴趣的是stats module (part) of the Webpack. Basically, it's this module that produces the output. The output by default mostly contains list of assets, and list of modules. You can hide modules with --hide-modules directive. Regarding assets, no similar option exists. But there are presets。您可以使用 --display 选项指定预设。而隐藏资产的预设是... none.

还有另一种影响统计数据的方法：webpack.config.js。添加 stats: {assets: false, modules: false} 以显着减少输出。或者 stats: 'none' 让 Webpack 完全静音。不是我推荐它。一般来说 errors-only 是一种方式。要使其影响 webpack-dev-server，请将其放在 devServer 键下。

Webpack 2.x 没有 --display 选项。隐藏模块的唯一方法是 --hide-modules 开关。我的意思是在配置中指定 stats: 'errors-only' 或 stats: {modules: false} 没有效果。因为 this 一段代码覆盖了所有这些。

对于 webpack-dev-server 还有 --no-info and --quiet 选项。

更深入地了解它是如何工作的。 webpack-cli 创建 outputOptions object. When compilation finishes, it converts stats to string and outputs it. Stats.toString converts stats to json, then converts json to string. Here you can see the defaults.

Answer 10

这些天 noInfo quiet 和 stats 已被 Webpack 配置根目录中的 infrastructureLogging 取代：

// webpack.config.js
...
infrastructureLogging: {
  level: 'error',
},

Answer 11

Webpack v5

“最静音”配置：

infrastructureLogging: { level: 'error' },
stats: 'minimal',

文档：infrastructureLogging, stats.

Webpack：静音输出

Webpack: silence output

webpack

webpack-dev-server

Webpack

开发服务器

参考

Webpack v5