使用webpack進行打包就必須要掌握webpack的5個核心的概念

入口(entry)

入口起點(entry point)指示 webpack 應該使用哪個模組，來作為構建其內部依賴圖(dependency graph)的開始。進入入口起點後，webpack 會找出有哪些模組和庫是入口起點（直接和間接）依賴的。

輸出(output)

output屬性告訴 webpack 在哪裡輸出它所建立的bundle，以及如何命名這些檔案。主要輸出檔案的預設值是./dist/main.js，其他生成檔案預設放置在./dist資料夾中。

loader

webpack 只能理解 JavaScript 和 JSON 檔案，這是 webpack 開箱可用的自帶能力。loader讓 webpack 能夠去處理其他型別的檔案，並將它們轉換為有效模組，以供應用程式使用，以及被新增到依賴圖中。

外掛(plugin)

loader 用於轉換某些型別的模組，而外掛則可以用於執行範圍更廣的任務。包括：打包優化，資源管理，注入環境變數。

模式(mode)

通過選擇development,production或none之中的一個，來設定mode引數，你可以啟用 webpack 內建在相應環境下的優化。其預設值為production。