Troubleshoot: Webpack with react-hot-loader Throwing [WDS] Disconnected!

Date: 2016-03-11 |

DISCLOSURE: If you buy through affiliate links, I may earn a small commission. (disclosures)

**Problem: **I’m using Webpack with react-hot-loader enabled to hot load all of my React components. However, when I hit my webpack-dev-server, I don’t get any hot reloads. It shows my app, but I have to manually refresh the page to see any changes. In the console it spits out a ‘[WDS] Disconnected!’ error.

**Solution: **Because you can see the site, but hot reload doesn’t work, I’d imagine it has something to do with your webpack.config.js file being configured incorrectly.

Double check your module.exports “entry” property for misspellings. If you’re having continued issues, try hosting the project on the default localhost port:

entry: [
‘webpack-dev-server/client?http://localhost:8080’,
‘webpack/hot/only-dev-server’,
‘./src/index.jsx’
],

Of course, your own file of entry (the third element) is probably different.

Want more like this?

The best way to support my work is to like / comment / share for the algorithm and subscribe for future updates.