《webpack4.0各個擊破系列》适合不滿足于隻會配置但一時間又看不懂源碼的中級讀者。我沒法保證這個系列是最好的，但至少能保證每一篇博文都跟那些webpack
和Ctrl+C
的博文有本質的差別，不信你讀讀看。Ctrl+V
一.webpack是什麼
中文版官方網址：www.webpackjs.com
webpack
是前端最火的打包工具，是大前端自動化工廠的重要組成部分。上面的LOGO已經非常形象地表達了
webpack
所做的最主要的事情——打包，盡管它為非常多的工具提供了适配接口，但官網仍然推薦将
webpack
作為自動化工具鍊的一部分內建進更大的工具系統，而不是将一切需求的實作都寄希望于
webpack
。
二.webpack4.0各個擊破系列
《webpack4.0各個擊破系列》是筆者原創的
webpack
4.0使用指南，它并不像其他教程那樣一步一步貼着圖來示範配置方法，而是通過問題+推演的方式，從打包需要解決的問題，對應的處理政策，以及
webpack
相關的一些配置和原理等進行綜合講解。如果你還沒有使用過
webpack
，那麼建議你先閱讀官方文檔和一些入門級的配置教程（它們可能已經過時了，社群裡針對
webpack
4.0以上版本的博文并不多，而且大多數都隻是在重複官網已經聲明過的問題）。如果你想從“為什麼”的層面上了解
webpack
，那麼閱讀本系列一定會帶給你收獲。
- 《Webpack4.0各個擊破（1）html篇》 https://www.cnblogs.com/dashnowords/p/9478777.html
- 《Webpack4.0各個擊破（2）css篇》 https://www.cnblogs.com/dashnowords/p/9520414.html
- 《Webpack4.0各個擊破（3）assets篇》 https://www.cnblogs.com/dashnowords/p/9545476.html
- 《Webpack4.0各個擊破（4）javascript & splitChunks篇》 https://www.cnblogs.com/dashnowords/p/9545482.html
- 《Webpack4.0各個擊破（5）module篇》 https://www.cnblogs.com/dashnowords/p/9557366.html
- 《Webpack4.0各個擊破（6）loader篇》 https://www.cnblogs.com/dashnowords/p/9557372.html
- 《Webpack4.0各個擊破（7）plugin篇》 https://www.cnblogs.com/dashnowords/p/9572749.html
- 《Webpack4.0各個擊破（8）tapable篇》 https://www.cnblogs.com/dashnowords/p/9572750.html
- 《Webpack4.0各個擊破（9）karma篇》 https://www.cnblogs.com/dashnowords/p/9572753.html
- 《Webpack4.0各個擊破（10）integration篇》 https://www.cnblogs.com/dashnowords/p/9572754.html
三.webpack4.0進階話題
如果上面的内容中涉及的大多數知識你已經掌握，那麼下面的文章應該能夠幫助你進一步提高。
- awesome-webpack 這個項目裡搜羅了非常多的webpack相關的優秀文章，從入門到源碼都有。在閱讀完筆者的《webpack4.0各個擊破》系列後，按照這個清單來查漏補缺就再好不過了。
- 【如何實作一個簡單的webpack】 這個系列隻寫了3篇，作者用造輪子的方法示範了
webpack
- 【淺析webpack源碼系列】 作者通過30多篇博文，按照
webpack
webpack
webpack