我在使反应热的webpack加载器正常工作时遇到了一些麻烦.
[HMR] Waiting for update signal from WDS…
[WDS] Hot Module Replacement enabled.
但是当我保存更改时,页面会自动刷新浏览器(而不是HMR替换).
//webpack.config.js
{
entry: {
client: 'webpack-dev-server/client?http://localhost:8786',// WebpackDevServer host and port
app: "./HelloWorld.tsx"
},devtool: process.env.WEBPACK_DEVTOOL || 'cheap-module-source-map',output: {
path: path.join(__dirname,'dist'),filename: '[name].entry.js'
},module: {
loaders: [
{
test: /\.ts(x?)$/,loaders: ['react-hot','babel-loader?cacheDirectory=true,presets[]=es2015,presets[]=react','ts-loader']
}
]
},devServer: {
contentBase: "./dist",port:8786
},plugins: [
new webpack.NoErrorsPlugin()
]
}
命令：webpack-dev-server –hot –inline
在一个有趣的旁注,如果我使用babel-preset-react-hmre,一切都按预期工作. (但我真的不想使用它,因为它看起来比正确的反应热装载机支持更少).
解决方法
我刚遇到这个问题.几件事：
要帮助调试您的特定问题,请尝试启用“保留日志”(在Chrome开发工具中).这将在页面刷新期间保持控制台日志,因此您至少可以在触发刷新之前查看webpack-dev-server正在记录的任何消息.
在我的情况下,webpack-dev-server很新鲜,因为我没有在我的条目js文件中选择HMR.将以下行添加到文件解决了问题：
// Opt-in to Webpack hot module replacement if (module.hot) module.hot.accept()
有关module.hot API的详细信息,webpack HMR docs非常有用.
更新：一个时代的结束,webpack 1文档不再起作用.对于仍在寻找的人,HMR docs are here now.
