有没有办法让 webpack 不显示它正在编译的所有块？答案

【问题标题】：Is there a way to make webpack not show all the chunks it's compiling?有没有办法让 webpack 不显示它正在编译的所有块？
【发布时间】：2016-06-26 09:14:55
【问题描述】：

默认的 webpack CLI 输出对我来说太冗长了。一旦我从我的一个文件中导入 React，输出就会爆炸，显示所有块 (?) 正在打包：

webpack result is served from /
content is served from /Users/me/myproject
Hash: aaaf5afc6582f3222f55
Version: webpack 1.12.14
Time: 1175ms
   Asset    Size  Chunks             Chunk Names
index.js  677 kB       0  [emitted]  main
chunk    {0} index.js (main) 643 kB [rendered]
    [0] ./src/app.js 574 bytes {0} [built] [1 error]
    [1] ./~/react/react.js 56 bytes {0} [built]
    [2] ./~/react/lib/React.js 1.49 kB {0} [built]
    [3] ./~/react/lib/ReactDOM.js 3.71 kB {0} [built]
    [4] ./~/process/browser.js 2.06 kB {0} [built]

...

  [155] ./~/fbjs/lib/mapObject.js 1.47 kB {0} [built]
  [156] ./~/react/lib/onlyChild.js 1.21 kB {0} [built]
  [157] ./~/react/lib/deprecated.js 1.77 kB {0} [built]
  [158] ./~/react-dom/index.js 63 bytes {0} [built]
  [159] ./src/component.js 339 bytes {0} [built] [1 error]

我真的不在乎所有这些额外的信息。我很高兴有一种方法：

完全禁用块，只显示整体进度
只显示我自己的代码，而不是我从我的 node_modules 导入的东西

目前我的 webpack 命令是webpack-dev-server --progress。我的 webpack 配置非常基础，只为 babel 和 eslint 指定入口、输出和加载器。

【问题讨论】：

标签： node.js webpack webpack-dev-server

【解决方案1】：

在命令行中，我无法找到执行此操作的方法。

但是，如果您有 webpack.config.js 文件，则有两个选项可用于隐藏模块列表..

devServer: {
    stats: 'errors-only'
}

或

devServer: {
    stats: { chunks: false }
}

希望对您有所帮助。

【讨论】：

不确定我是否做错了什么，但我无法让其中任何一个工作。它仍然总是打印大量的模块列表:(我也尝试在运行测试时将它添加到我的业力配置的 webpack 部分，但它在那里也不起作用。
不管它值多少钱——这些都对我有用。运行 webpack-dev-server 1.16.2
devServer: { stats: { chunks: false } } 为我工作。
唯一对我有用的地方是 'webpack.base.babel' 对于那些使用 react-boilerplate 的人。

【解决方案2】：

如果您的项目中有 webpack.config.js，请将以下内容添加到导出函数的返回对象中：

devServer: {
    stats: {
        assets: false,
        children: false,
        chunks: false,
        hash: false,
        modules: false,
        publicPath: false,
        timings: false,
        version: false,
        warnings: true,
        colors: {
            green: '\u001b[32m'
        }
    }
}

【讨论】：

允许将这些“stats:”选项添加到我的 webpack.config.js 中 module.exports 字典的根目录，并结合 --hide-modules CLI 参数（如@artnova 所建议）静音/调整 webpack 包输出的每个细节。

【解决方案3】：

这在我的情况下有效：

webpack --hide-modules

【讨论】：

广泛搜索 - 最佳答案
在 webpack 3 中不起作用（编辑：它确实起作用，只要你也没有传递 --color 标志）

【解决方案4】：

有 webpack 无证 option --hide-modules。您可以通过将此行添加到webpack config 将其从webpack-dev-server 传递给webpack：

devServer: { 'hide-modules': true }

【讨论】：

刚刚试了一下，好像没什么区别。我也试过--hide-modules=true。
我还为 webpack-dev-server 找到了 --quiet 选项。这摆脱了模块/块列表，但它也完全消除了我更改代码时发生打包的任何迹象。所以这可能是太很少信息。
hide-modules 是 webpack 选项，似乎它不是从 webpack-dev-server 传递的。
不，这似乎也不起作用:(从好的方面来说，我意识到它只在第一次运行时显示完整列表。如果我然后去修改一个文件并保存它，控制台只显示有关我刚刚修改的文件的信息。我可以忍受:)

【解决方案5】：

从 Webpack 3+ 开始，--display 标志允许对输出进行细粒度控制：

--display=(verbose|detailed|normal|minimal|errors-only|none)

【讨论】：

【解决方案6】：

在webpack.config.ts，可以试试

devServer : {
  stats: 'minimal',
  watchOptions: { 
   poll: undefined,
   aggregateTimeout: 300,
   ignored: /node_modules/
 }
}

希望有效。

【讨论】：