koa-webpack-middleware-zm

webpack-dev-middleware and webpack-hot-middleware for koa

Install

$ npm i koa-webpack-middleware-zm -D

Usage

const koa = require('koa')
const webpack = require('webpack')
const webpackDevMiddleware = require('webpack-dev-middleware')
const webpackHotMiddleware = require('webpack-hot-middleware')
const { koaDevMiddleware, koaHotMiddleware } = require('koa-webpack-middleware-zm')

const devConfig = require('./webpack.dev.config')
const app = koa()
const devCompiler = webpack(devConfig)
// dev
const expressDevMiddleware = webpackDevMiddleware(devCompiler, {
    /* opt */
    publicPath: devConfig.output.publicPath,
    stats: {
        colors: true
    }
})
app.use(koaDevMiddleware(expressDevMiddleware))
/*
//ssr
expressDevMiddleware.fileSystem
*/
// hot
const expressHotMiddleware = webpackHotMiddleware(devCompiler, {/*opt*/})
app.use(koaDevMiddleware(expressHotMiddleware))

HMR(hot) configure

1. webpack plugins configure

plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin()
]

2. webpack entry configure

entry: {
    app: ['webpack-hot-middleware/client?path=/__webpack_hmr&timeout=20000', 'app.js']
}