1：什麼是webpack和grunt和gulp有什麼不同

答案：Webpack是一個模組打包器，他可以遞迴的打包專案中的所有模組，最終生成幾個打包後的檔案。他和其他的工具最大的不同在於他支援code-splitting、模組化(AMD，ESM，CommonJs)、全域性分析。

2：什麼是bundle,什麼是chunk，什麼是module?

答案：bundle是由webpack打包出來的檔案，chunk是指webpack在進行模組的依賴分析的時候，程式碼分割出來的程式碼塊。module是開發中的單個模組。

3：什麼是Loader?什麼是Plugin?

答案： 1）Loaders是用來告訴webpack如何轉化處理某一型別的檔案，並且引入到打包出的檔案中 2）Plugin是用來自定義webpack打包過程的方式，一個外掛是含有apply方法的一個物件，通過這個方法可以參與到整個webpack打包的各個流程(生命週期)。

4:如何可以自動生成webpack配置？

答案： webpack-cli /vue-cli /etc …腳手架工具

5：webpack-dev-server和http伺服器如nginx有什麼區別?

答案：webpack-dev-server使用記憶體來儲存webpack開發環境下的打包檔案，並且可以使用模組熱更新，他比傳統的http服務對開發更加簡單高效。

6:什麼 是模組熱更新？

答案:模組熱更新是webpack的一個功能，他可以使得程式碼修改過後不用重新整理瀏覽器就可以更新，是高階版的自動重新整理瀏覽器。

7：什麼是長快取？在webpack中如何做到長快取優化？

答案：瀏覽器在使用者訪問頁面的時候，為了加快載入速度，會對使用者訪問的靜態資源進行儲存，但是每一次程式碼升級或是更新，都需要瀏覽器去下載新的程式碼，最方便和簡單的更新方式就是引入新的檔名稱。在webpack中可以在output縱輸出的檔案指定chunkhash,並且分離經常更新的程式碼和框架程式碼。通過NameModulesPlugin或是HashedModuleIdsPlugin使再次打包檔名不變。

8：什麼是Tree-shaking?CSS可以Tree-shaking嗎?

答案：Tree-shaking是指在打包中去除那些引入了，但是在程式碼中沒有被用到的那些死程式碼。在webpack中Tree-shaking是通過uglifySPlugin來Tree-shaking JS。Css需要使用Purify-CSS。

“相信有很多想學前端的小夥伴，今年年初我花了一個月整理了一份最適合2018年學習的web前端乾貨，從最基礎的HTML+CSS+JS到移動端HTML5到各種框架都有整理，送給每一位前端小夥伴，53763，1707這裡是小白聚集地，歡迎初學和進階中的小夥伴。”

最後：祝大家早日學有所成，拿到滿意offer，快速升職加薪，走上人生巔峰。