服务器多个散文件热更新,koa服务端热更新问题

问题

webpack的入口文件./build/test/src/entry/index

引入css文件 修改后热更新正常

但是只要修改的是js代码， webpack就会不断的打包，最后才更新到浏览器，过程将近10s，

网上的很多例子都是express

服务端用的是koa

热更新插件是koa-webpack-dev-middleware，koa-webpack-hot-middleware

webpack的配置

const webpack = require('webpack');

const path = require('path');

var publicPath = 'http://192.168.1.100:1919/dist/';

var hotMiddlewareScript = 'webpack-hot-middleware/client?path=/__webpack_hmr&timeout=20000&reload=true';

module.exports = {

entry: {

index: [

hotMiddlewareScript,

'./build/test/src/entry/index'

]

},

output:{

filename: 'bundle.[name].js',

path: path.resolve(__dirname, "./build/test/src"),

publicPath: publicPath

},

module: {

loaders: [

{

test: /.css$/,

loader: 'style-loader!css-loader'

},

{

test: /\.js$/,

loader: 'babel-loader',

query: {

'presets': ['es2015', 'stage-0']

}

}

]

},

plugins: [

new webpack.optimize.OccurrenceOrderPlugin(),

new webpack.HotModuleReplacementPlugin(),

new webpack.NoEmitOnErrorsPlugin()

]

}

项目目录

app.js 服务端

const webpack = require('webpack');

const webpackDevMiddleware = require('koa-webpack-dev-middleware');

const webpackHotMiddleware = require('koa-webpack-hot-middleware');

const config = require('./webpack.config');

const koa = require('koa');

const app = new koa();

const convert = require('koa-convert');

const router = require('./server/router/router');

const koaStatic = require('koa-static');

const views = require('co-views');

const compiler = webpack(config);

app.use(webpackDevMiddleware(compiler, {

noInfo: true,

watchOptions: {

ignored: /node_modules/,

},

reload: true,

publicPath: config.output.publicPath,

stats: {

colors: true

}

}))

app.use(webpackHotMiddleware(compiler))

app.use(async function(ctx,next) {

ctx.render = views(__dirname + '/server', {

ext: 'ejs',

});

await next();

})

.use(koaStatic(__dirname + '/release'))

.use(router.routes())

.use(router.allowedMethods())

app.listen(1919)

package.json

{

"devDependencies": {

"babel-core": "^6.26.0",

"babel-loader": "^7.1.2",

"babel-preset-es2015": "^6.24.1",

"babel-preset-stage-0": "^6.24.1",

"co-views": "^2.1.0",

"css-loader": "^0.28.8",

"ejs": "^2.5.7",

"eventsource-polyfill": "^0.9.6",

"express-to-koa": "^1.0.6",

"koa": "^2.4.1",

"koa-convert": "^1.2.0",

"koa-router": "^7.3.0",

"koa-static": "^4.0.2",

"koa-webpack-dev-middleware": "^2.0.2",

"koa-webpack-hot-middleware": "^1.0.3",

"koa-webpack-middleware": "^1.0.7",

"style-loader": "^0.19.1",

"webpack": "^3.3.0",

"webpack-dev-middleware": "^1.12.0",

"webpack-hot-middleware": "^2.18.2"

},

"dependencies": {

"koa": "^2.0.0-alpha.8"

}

}