webpack中自动打包的三种方式

1.在package.json中的scripts中配置一个键值对，其中键名自取，值为“webpack --watch”，如：

配置后，直接运行打包命令npm run watch则可打包成功并在浏览器中运行，当我们修改源文件之后不要重新打包，只需刷新浏览器即可。
缺点：此种配置，打包后在浏览器中是以file请求运行的，所以无法发送ajax请求。
2.在package.json中的scripts中配置一个键值对，其中键名自取，值为“webpack-dev-server”,同时在webpack.config.js中的module.exports中配置devServer，如：


注：此种配置方式，需要我们安装webpack-dev-server.
优点：这样配置后，运行npm run dev进行打包，打包成功后会自动在浏览器中运行打包文件，并且是以http请求运行，这种就可以发送ajax请求，而且当我们改变源代码之后，我们只需进行保存，不需要再次打包，也不需要刷新浏览器，浏览器会自动为我们刷新。
3.自己写一个开启服务器的js
首先，我们还是需要在package.json中配置一个键值对，键名自取，但是值为“node server.js”,配置后再在webpack.config.js中的output中配置publicPath为根路径，最后新建一个js文件，在js文件中写开启一个服务器的相关代码，如：



这种方式用到了nodejs的知识，如不了解nodejs的知识，这种方式可作为简单了解。