鍍金池/ 問答/HTML/ webpack打包時終端參數(shù)各代表什么意思?

webpack打包時終端參數(shù)各代表什么意思?

webpack打包信息

如圖可見,webpack的打包信息,在上圖中,asset代表打包后的文件名,size代表文件大小,那么其他的是什么意思,Chunks是什么意思?0,4|1,4|2,4|3,4|4各是什么意思,后面的chunk Names是什么意思?下面的那些信息又是什么意思,那些帶顏色的是什么意思(emitted,built)?

新手,求前端大神不吝賜教,萬分感謝!

回答
編輯回答
鹿惑

建議題主在配置中開啟stats:'detailed'(用這個其實(shí)日志更有條理)或stats:'verbose',獲取更詳細(xì)的構(gòu)建日志,這樣能看到更多的構(gòu)建細(xì)節(jié)。

頂部的那部分,表示構(gòu)建輸出結(jié)果

  • asset列 - 指構(gòu)建后輸出的資源文件,名稱由filename的配置決定,如可能是[name].[hash].js這樣子
  • size列 - 指構(gòu)建后輸出的資源文件的大小
  • emitted列 - 指文件被輸出
  • Chunk Names列 - 指這個構(gòu)建塊的名稱,即各個chunk塊輸出期間chunk塊名稱,比如entry配置項(xiàng)里定義的入口名稱、CommonsChunkPlugin里定義的名稱等等
  • Chunks列 - 表示有每個入口chunk中有哪些模塊也被當(dāng)成了入口chunk處理

底部的部分,表示構(gòu)建輸出過程

構(gòu)建過程如下:
因?yàn)闆]有使用詳細(xì)的日志輸出,所以解釋上會少了一些細(xì)節(jié),我做適當(dāng)?shù)难a(bǔ)充。

最左邊的數(shù)字表示構(gòu)建過程處理每個模塊順序(每次構(gòu)建都會因?yàn)槟愦a中模塊引入的順序隨時改變)
黃色數(shù)字那塊表示當(dāng)前資源chunk塊里被用到過,如果被多個chunk用到,那么這里就會是多個數(shù)字
綠色built表示它是構(gòu)建過程的一部分

2018年4月8日 15:25