概念問題一：什麽是webpack和grunt和gulp有什麽不同

答案：Webpack是一個模塊打包器，他可以遞歸的打包項目中的所有模塊，最終生成幾個打包後的文件。他和其他的工具最大的不同在於他支持code-splitting、模塊化(AMD，ESM，CommonJs)、全局分析。

概念問題二：什麽是bundle,什麽是chunk，什麽是module?

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

概念問題三：什麽是Loader?什麽是Plugin?

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

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

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

開發問題一：webpack-dev-server和http服務器如nginx有什麽區別?

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

開發問題二:什麽 是模塊熱更新？

答案:模塊熱更新是webpack的一個功能，他可以使得代碼修改過後不用刷新瀏覽器就可以更新，是高級版的自動刷新瀏覽器。

優化問題一：什麽是長緩存？在webpack中如何做到長緩存優化？

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

優化問題二：什麽是Tree-shaking?CSS可以Tree-shaking嗎

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

願你成為終身學習者

webpack常見問題