你只需要一行就可以實現hot-reload和友好的錯誤提示
new WebpackBrowserLog(webpackConfig)
這裡有張gif的效果圖,請等待
平時我們都在瀏覽器的console皮膚裡看錯誤,或者是在命令列裡看錯誤真是太累了!瀏覽器直接顯示錯誤極大的提升了開發的效率!
不久前研究webpack2,順便產出了一個這樣的小工具。好吧,其實很早以前就有了,在下只是封裝了下webpack-dev-middlewar
和webpack-hot-middleware
而已,然後可以很便捷的呼叫。如下
const WebpackBrowserLog = require('webpack-browser-log'); // 引入webpack-browser-log
const merge = require('webpack-merge'); // 引入webpack-merge
const 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吧!希望你喜歡!
文章首發於www.meckodo.com
下一篇,我們將會介紹webpack兩種配置的差異。