webpack 是前端項目工程化的具體解決方案。 它提供了友好的前端模塊化開發(fā)支持，以及代碼壓縮混淆、處理瀏覽器端 JavaScript 的兼容性、性能優(yōu)化等強大的功能。

讓程序員把工作的重心放到具體功能的實現(xiàn)上，提高了前端開發(fā)效率和項目的可維護性。目前企業(yè)級的前端項目開發(fā)中，絕大多數(shù)的項目都是基于 webpack 進行打包構(gòu)建的。

在項目中安裝webpack，需要先在終端運行如下的命令，安裝 webpack 相關(guān)的兩個包：

npm install webpack@5.5.1 webpack-cli04.2.0 -D

在項目中配置 webpack

① 在項目根目錄中，創(chuàng)建名為 webpack.config.js 的 webpack 配置文件，并初始化如下的基本配置：

module.exports ={
   mode:'development'// mode用來指定構(gòu)建模式?？蛇x值有 development和 production
}

② 在 package.json 的 scripts 節(jié)點下，新增 dev 腳本如下：

"scripts":{
   “dev"：“webpack"// script 節(jié)點下的腳本,可以通過 npm run 執(zhí)行。例如 npm run dev
}

③ 在終端中運行 npm run dev 命令，啟動 webpack 進行項目的打包構(gòu)建。