一、安裝配置webpack

1）：在專案根目錄中，初始化npm包管理環境。執行 npm init -y命令

2）：在專案根目錄中，執行 npm install webpack webpack-cli -D 命令，安裝相關的包

3）：在專案根目錄中，建立 webpack.config.js 配置檔案 並在檔案中初始化以下程式碼：

 1 const path = require('path');
 2 
 3 module.exports = {
 4     mode: 'development', // production(產品模式會壓縮)/development(開發模式未經過壓縮)
 5     //
 
 手動配置webpack 的打包入口與出口
 6     entry: path.join(__dirname, './src/index.js'), // 打包入口檔案的路徑
 7     output: {
 8         path: path.join(__dirname, './dist'), // 輸出檔案的存放路徑
 9         filename: 'bundle.js' // 輸出的檔名
10     }
11 }

4）：在 package.json 檔案中的 "scripts" 節點下，新增 “dev” 指令碼：

"scripts": {
        "dev": "webpack" //
 
 節點下的指令碼，可通過 npm run 執行
    }

二、配置自動打包功能