Webpack错误＆＃34; [HMR]您需要重新启动应用程序！＆＃34;

Question

我使用Webpack HMR作为Node.js（Koa2）服务器。 HMR工作顺利，直至出现错误。 HMR在此之后停止工作。

例如，当＆＃39; asdfadsf＆＃39;变量未定义：

[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! <============

如何解决这个问题？

"webpack": "^3.10.0"

条目文件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

在HMR处于活动状态时出现新错误的server.js

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

我在webpack服务器配置文件中使用的一些插件

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

注意：我不确定这是好事还是坏事，但确实有效。

我将ES6导入更改为requires，并在accept函数中添加了try / catch块。

更改了条目文件（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()
    })
}