1、傳統：
1）分模塊去定義js。js中要導出將來要被打包的方法module.exports
2）定義main.js入口文件（主文件）。在此文件中，導入引用的js文件
var {add} = require("./model01.js")
//var {add} = require("./model01")
可以在main.js中使用要導入的js方法
3）使用webpack命令打包js。
4）在html上引用打包生成的工具
2、推薦使用webpack-dev-server開發服務器，它的功能可以實現熱加載 並且自動刷新瀏覽器。
1）安裝webpack-dev-server
cnpm install webpack@3.6.0 webpack-dev-server@2.9.1 html-webpack-plugin@2.30.1 --save-dev
安裝完成自動創建package.json（記錄了本程序所依賴的包的信息）
安裝完成自動創建node_modules（存放本程序所依賴的包）
2）在package.json中配置script
“scripts”: {
"dev": "webpack-dev-server --inline --hot --open --port 5008
},
--inline 自動刷新
--hot 熱加載
--open 自動在默認瀏覽器打開
--port 5008 指定端口
devDependencies 開發人員在開發過程中所需要的依賴
scripts：可執行的命令
3）配置webpack.config.js
在項目目錄下創建webpack.config.js，他是webpack的配置文件，在此文件中可以配置文件的入口文件、輸出配置、
插件等，其中，要實現熱加載自動刷新功能需要配置html-webpack-plugin插件，其作用是根據html模板在內存生成
html文件，他的工作原理是根據模板文件在內存中生成一個index.html文件
A.配置模板文件 index.html
B.配置html-webpack-plugin插件
C.配置webpack.config.js
webpack的配置文件，配置了入口文件、輸入文件的路徑、依賴的插件。
D.使用webpack命令去運行程序 npm run dev
4) debug調試
配置如下：
A.在webpack.config.js中配置
devtool: 'eval-source-map',
webpack.config.js中內容如下
B.在js中跟蹤代碼的位置上添加debugger
一個例子：
在add 方法中添加debugger 如下圖：
