1：確保自己的電腦已經安裝了node和Git軟體

2：自己在盤裡隨便建立一個資料夾一般為英文(也就是你自己的專案名稱)

3：在新建立好的資料夾裡面右鍵點選調出git指令視窗在窗口裡面輸入如下指令：

    1：npm install webpack -g            

    2:  npm install webpack-cli -g

    3: npm init -y

    4: npm install webpack --save-dev

   5  npm install html-webpack-plugin    （html編譯外掛）

 6：npm install clean-webpack-plugin

   5：把專案拖進編輯器

   6新建一個src資料夾  和webpack.config.js

7:webpack.config.js內容配置如下：

const path = require("path");
const WebpackHtmlPlugin = require('html-webpack-plugin');  //匯入html打包外掛
const clear= require("clean-webpack-plugin");  //匯入清除dist外掛 不用手動每次去刪除dist檔案
                                                //   夾

module.exports = {
	entry: {
		index1: './src/index1.js',
		index2: './src/index2.js'
	},
	output: {
		path: path.resolve(__dirname, "dist"),
		filename: "[name].js"
	},
	plugins: [
		new WebpackHtmlPlugin({
			minify: {
				collapseWhitespace: true, //清除空格
				removeAttributeQuotes: true, //清除多餘引號
				removeComments: true //刪除註釋
			},
			title: "hello",
			template: "./src/index.html",
			chunks: ['index'],
			filename: "index.html"

		}),
		new WebpackHtmlPlugin({
			minify: {
				collapseWhitespace: true, //清除空格
				removeAttributeQuotes: true, //清除多餘引號
				removeComments: true //刪除註釋
			},
			title: "hello2",          //打包成功後的html名字
			template: "./src/index2.html",//要打包的檔案路徑
			chunks: ['index2'],
			filename: "index2.html"          //要打包的檔名稱

		}),
        new clear（）     //匯入模組清除dist外掛 不用手動每次去刪除dist檔案
                                                //   夾

	]
}
 

8：package.json  scripts配置如下：

"scripts": {
     "build": "webpack --mode production"    //production生產環境  development開發環境
  },

9：要打包的html  title處需配置

<title><%=htmlWebpackPlugin.options.title%></title>

10：執行命令進行打包 npm run build