Webpack是一個前端構建工具，可以將所有資源（包括Javascript，影象，字型和CSS等）打包後置於依賴關係中，使你可以按照需求引用依賴來使用資源。

那麼什麼時候使用呢？如果你正在用許多非程式碼的靜態資源（比如CSS，影象，字型等）構建一個複雜的前端應用程式，那麼Webpack會給你帶來很大的好處。如果你的應用程式非常小，並且你沒有什麼的靜態資源，並且你只需要一個JS檔案就足夠客戶端需求，那麼Webpack就沒有必要使用。

webpack的好處：

清晰簡明的模組。一個稍微有點規模的應用往往有著一個複雜的資源關係網，在需要做最佳化的時候就會使一件非常的頭疼的事情。webpack可以代替你做這個麻煩事，將複雜的多個檔案打包成你希望的程式碼模組，引入會非常清晰，想對引入檔案做點什麼操作也會更容易。程式碼拆分來做資源非同步載入。webpack打包成一個模組之後也帶來一個問題，如果載入模組過於龐大，載入的速度就沒法保證，所以webpack也提供了拆分程式碼後非同步載入的方式，即先載入某個主要模組，當用到某個需要資源非同步載入的模組時在對其傳送請求載入，這樣做在大型專案中很常見。消除對未引用資源的依賴。在複雜應用又多靜態資源的情況下會減少很多無效的浪費，這會對應用的有很大提升。可以控制資源的處理方式。透過loader或者外掛，我們可以對不同型別的檔案引入做我們希望的操作。比如對程式碼壓縮，uglify，圖片壓縮，檔案處理，css預處理等等。穩定的生產部署。開發環境到生產環境的自定義配置到打包方式，透過同一套流程穩定的匯出，這些都會給專案帶來很大的效率提升，這對於一個大型專案來說，是至關重要的。一系列開發輔助工具。Dev-Server，HMR，這些都不用再一點點去配置，即開即用，大大提升了開發效率。

總的來說，一個成熟的前端應用都會需要一套構建打包工具，隨著前端的進步發展推陳出新，現在公認較為優秀的就是webpack了。