01、安裝node.js

02、新建工程目錄Webpack

03、初始化node工程

npm init

　　根據提示，輸入工程資訊

04、本地安裝webpack（可使用更新的版本）

npm install [email protected] --save-dev

05、新建子目錄

　　dist----編譯後文件所在路徑

　　src----程式碼路徑

06、新建webpack.config.js配置檔案(CommonJS語法)

1 const path = require('path')
2 module.exports = {
3     entry: './src/main.js',
4     output: {
 
5         path: path.resolve(__dirname, "dist"),
6         filename: 'bundle.js'
7     }
8 }

　　entry:原始碼入口

　　output:編譯後文件放置路徑 & 檔名

　　在src下建main.js檔案

07、在package.json中新增命令

"build":"webpack"

• npm run build會執行package.json中scripts下定義的build指令碼，即會執行webpack命令
• 執行package.json中的scripts下的指令碼時，首先會尋找本地node_modules/.bin路徑下的命令，找不到，則用全域性命令

09、webpack說明（直接執行webpack命令時，需要自己找到webpack命令所在目錄執行，不同於使用npm）

• 正常使用時,webpack ./src/main.js ./dist/bundle.js
• 若有webpack.config.js配置，則配置中已經有原始檔和目的檔案，只需要執行webpack命令即可