我们在开发的时候，如果只是进行简单的配置，那么我们每一次修改代码，都要手动的进行打包，然后手动的刷新浏览器，这样的话，开发的效率会很低，所以我们这个时候就要想webpack是否可以为我们提供一种方式让webpack帮助我们完成上面的操作，而不是依靠手动进行处理。
监听的方法
在package.json进行相关的配置：
"scripts": {
"watch": "webpack --watch",
},
进行上面的配置后后，执行命令npm run watch我们就会直接监听源代码，当源代码发生改变，会自动为我们重新打包。
webpack-dev-server
我们有的时候期望，我们不仅仅可以直接监听变化的时候进行重新打包，并创建一个服务，在浏览器上的表现是自动刷新浏览器。
module.exports = {
mode: 'development',
devtool: 'chep-module-eval-source-map',
devServer: {
contentBase: './dist',
open: true, // 会自动打开一个浏览器
proxy: 8000
},
}
在package.json进行相关的配置：
"scripts": {
"start": "webpack-dev-server",
},
我们为什么要创建一个服务：
因为我们直接在本地通过文件协议的方式，是没有办法发送ajax的请求的。
自己配置node的书写方式，进行其服务
在package.json进行相关的配置：
"scripts": {
"server": "node server.js"
},
我们需要先安装一个中间件：webpack-dev-middleware
并在package.json 同级目录中，写一个server.js的文件
const express = require('express');
const webpack = require('webpack'); // 引入了webpack的库
const webpackDevMiddleware = require('webpack-dev-middleware');
const config = require('./webpack.config.js'); // 引入了webpack的配置文件
const complier = webpack(config); // 使用webpack和配置文件，可以随时的进行代码的编译
// 在node中使用wenpack
const app = express();
// 只要文件发生了改变，complier就会重新进行打包，打包后的文件放在publicPath路径下
app.use(
webpackDevMiddleware(complier, {
publicPath: config.output.publicPath
})
);
app.listen(3000, () => {
console.log('server is running');
});
