Webpack Error "[HMR] You need to restart the application!"

Question

I'm using Webpack HMR for a Node.js (Koa2) server. HMR is working smoothly, up untill an error is thrown. HMR stops working after that.

For instance, when the 'asdfadsf' variable is not defined:

[server] [HMR] ReferenceError: asdfadsf is not defined
[server]     at Object../server.js (A:\cms2\src\server\server.js:15:1)
[server]     at __webpack_require__ (A:\cms2\build\webpack\bootstrap 04a9ee280262ac7805a4:637:1)
[server]     at fn (A:\cms2\build\webpack\bootstrap 04a9ee280262ac7805a4:47:1)
[server]     at A:\cms2\src\server\index.js:13:35
[server]     at hotApply (A:\cms2\build\webpack\bootstrap 04a9ee280262ac7805a4:540:1)
[server]     at A:\cms2\build\webpack\bootstrap 04a9ee280262ac7805a4:248:1
[server]     at <anonymous>
[server]     at process._tickCallback (internal/process/next_tick.js:188:7)
[server] [HMR] You need to restart the application! <============

How can this be solved?

"webpack": "^3.10.0"

entry file index.js:

import app from './server'

const server = app.listen(4000)

if (module.hot) {
    module.hot.accept('./server', () => {
        server.removeAllListeners('request', app)
        server.on('request', app.callback())
    })
    module.hot.accept()
}

server.js

import 'babel-polyfill'
import Koa from 'koa'

const app = new Koa()

app.use((ctx) => {
    ctx.body = 'Hello World'
})
export default app

server.js with a new made error while HMR is active

import 'babel-polyfill'
import Koa from 'koa'

const app = new Koa()
// Undefined variable error which will crash the HMR functionality
asdfasdf
app.use((ctx) => {
    ctx.body = 'Hello World'
})
export default app

Some plugins I use in my webpack server config file

new StartServerPlugin({
    name: 'server.js',
    nodeArgs: ['--inspect'],
}),
new webpack.BannerPlugin({
    banner: 'require("source-map-support").install();',
    raw: true,
    entryOnly: false,
}),
new webpack.NamedModulesPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
new webpack.DefinePlugin({
    __CLIENT__: false,
    __SERVER__: true,
    __PRODUCTION__: false,
    __DEV__: true,
    'process.env': {
        NODE_ENV: '"development"',
        BUILD_TARGET: '"server"',
    },
}),

Answer 1

Note: I'm not sure if this is good or bad practice, but it works.

I changed the ES6 imports to requires and added a try/catch block inside the accept function.

Changed entry file (index.js)

let app = require('./server').default

const server = app.listen(4000)

if (module.hot) {
    module.hot.accept('./server', () => {
        try {
            server.removeAllListeners('request', server)
            app = require('./server').default
            server.on('request', app.callback())
        } catch (err) {
            console.log(err)
        }
    })
    module.hot.accept()
    module.hot.dispose(() => {
        server.close()
    })
}