请问webpack-dev-server与react-hot-loader两者的热替换有什么区别？

Question

写react调试的时候，需要实时刷新页面，我一开始是用hot-loader的，后来发现不用hot-loader，而只用webpack-dev-server来调试一样可以实时刷新。

那么请问这两者的实时刷新有什么区别么？
为什么要专门出一个hot-loader?

Answer 1

区别在于webpack-dev-server自己的--hot模式只能即时刷新页面，但状态保存不住。因为React有一些自己语法(JSX)是HotModuleReplacementPlugin搞不定的。

而hot-loader在--hot基础上做了额外的处理，来保证状态可以存下来

Answer 2

react-hot-loader 是对 webpack 的热加载进行了改进，支持 react 组件状态不丢失。题主可以尝试去掉开发环境的 react-hot-loader，然后修改网页上输入框的值，再修改代码，发现网页会刷新且输入框的值不在了。如果有 react-hot-loader 就不会存在该问题。

至于为什么要保存状态？这个在自己写代码调试的时候，可以体验到状态不丢失的好处！

Answer 3

webpack-dev-server是在页面中插入了代码，会发起一个websocket链接，当修改代码保存并重新打包之后，会返回数据控制浏览器刷新页面。
hot-loader不清楚，之前好像在哪里看到说hot-loader是实时替换reducer。

mark下，等高手解答。