你只需要一行就可以实现hot-reload和友好的错误提示

new WebpackBrowserLog(webpackConfig)

这里有张gif的效果图，请等待

平时我们都在浏览器的console面板里看错误，或者是在命令行里看错误真是太累了！浏览器直接显示错误极大的提升了开发的效率！

不久前研究webpack2，顺便产出了一个这样的小工具。好吧，其实很早以前就有了，在下只是封装了下webpack-dev-middlewar和webpack-hot-middleware而已，然后可以很便捷的调用。如下

const WebpackBrowserLog = require('webpack-browser-log'); // 引入webpack-browser-logconst merge = require('webpack-merge'); // 引入webpack-mergeconst webpackDev = require('./webpack.dev'); // 引入你webpack.dev的配置const base = require('./webpack.base'); // 引入你webpack base的配置const webpackConfig = merge(base,webpackDev); // 合并两配置//重点在下 ---------new WebpackBrowserLog(webpackConfig); // 默认只需要传入需要启动的webpack配置就OK了//重点在上 ---------复制代码

剩下的还是直接看github的readme吧！希望你喜欢！

文章首发于

下一篇，我们将会介绍webpack两种配置的差异。