web-dev-qa-db-ja.com

webpackがコンパイル中のすべてのチャンクを表示しないようにする方法はありますか？

デフォルトのwebpack CLI出力は、私の好みには冗長すぎます。私がファイルの1つから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.jswebpackwebpack-dev-server
21
Cam Jackson

コマンドラインから、これを行う方法を見つけることができませんでした。

ただし、webpack.config.jsファイル、モジュールのリストを抑制するための2つのオプションがあります。

devServer: {
    stats: 'errors-only'
}

または

devServer: {
    stats: { chunks: false }
}

お役に立てば幸いです。

10
freethebees

これは私の場合にはうまくいきました：

webpack --hide-modules
10
artnova

プロジェクトにwebpack.config.jsがある場合は、返されたexports関数のオブジェクトに以下を追加します。

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

文書化されていないwebpackオプション--hide-modulesがあります。この行を webpack config に追加すると、webpack-dev-serverからwebpackに渡すことができます。

devServer: { 'hide-modules': true }
4
Bob Sponge

Webpack 3+以降、--displayフラグにより​​、出力をきめ細かく制御できます。

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

Webpack.config.tsで、試すことができます

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

うまくいきますように。

0
PKDev