Webpack issue (WDS disconnected, Invalid Host/Origin header)

Help Requests
1

All i’m trying to do is create a simple project for a problem repo. I created a new webpack project using au new (typescript). I added a few lines to the app.ts/html for my issue, and when looking at the console I’m getting an endless list of the below error. My code that I want to show actually works, but it’s annoying to have the console going crazy. I’m not sure what I did wrong as even when I comment out the added code it’s still going crazy. This is the stuff that makes people angry at these modern web development tools :frowning: No special configuration was done at all.

[WDS] Disconnected! index.js:177
close
index.js:177
onclose
socket.js:17
[5]</EventTarget.prototype.dispatchEvent
sockjs.js:170
[14]</</SockJS.prototype._close/<
sockjs.js:969


Invalid Host/Origin header index.js:174
error
index.js:174
onmessage
socket.js:41
[5]</EventTarget.prototype.dispatchEvent
sockjs.js:170
[14]</</SockJS.prototype._transportMessage/<
sockjs.js:887
[14]</</SockJS.prototype._transportMessage
sockjs.js:885
[3]</EventEmitter.prototype.emit
sockjs.js:86
WebSocketTransport/this.ws.onmessage
sockjs.js:2961
2

It looks like webpacks HMR (hot module reloading) is not working. in webpack.config.js under devServer, add:

disableHostCheck: true

Curious to learn if that solves your issue

3

That unfortunately didn’t help.

4

Exact same issue here, and as @elitemike the disableHostCheck trick is not correcting the problem :frowning:

5

After some digging I discovered that this WebPack issue was being treated.

I installed the latest version and I no longer have the problem :slight_smile:

I just forced the version of webpack-dev-server (in charge of HMR) in my package.json file :slight_smile: webpack-dev-server": "^3.1.14"

I then changed it to “^3.1.14”, which is more flexible :wink:

Enjoy !

2 Likes