此文是「Webpack 2 視頻教程」的第十八集的補充文字文檔，主要對使用可視化圖表對 Webpack 2 的編譯與打包進行統(tǒng)計分析進行了詳細地講解，供您更加直觀地參考。
在之前更新的共十七集「Webpack 2 視頻教程」中，我們陸續(xù)講解了 Webpack 2 從配置到打包、壓縮優(yōu)化到調(diào)試狀態(tài)等情況都進行了詳細地講解，在這一小節(jié)，我們通過可視化的圖表對 Webpack 2 的打包編譯過程進行一個更加深刻地認識，同時可視化圖表也是對項目概況以及優(yōu)化指導(dǎo)是一個非常直觀的方案。
1. Webpack 2 的編譯統(tǒng)計信息生成
讓 Webpack 2 生成統(tǒng)計信息的參數(shù)主要是配置以下兩個。
--profile 統(tǒng)計生成至執(zhí)行時間相關(guān)信息，可選參數(shù)；
--json 讓 Webpack 生成統(tǒng)計信息，輸出格式為 json。
以下為測試項目 package.json 中的配置截圖。
配置后在命令行執(zhí)行命令 npm run stats 即可在項目目錄中看到生成的統(tǒng)計文件 stats.json。
