Accessing localhost externally when using webpack-dev-server
— 2 minute read
When doing web development, it's essential to be able to test and verify your work on different screen-sizes and devices.
For this we can use various tools like: BrowserStack, ngrok or a vitual machine running a different OS.
I have been doing this for years and years, but then something happened a few years ago... It's been a while since it happened, so some of the details are a bit blurry. But what happened was that I suddenly couldn't test my site running on localhost on BrowserStack. It just wouldn't connect... 😲 I thought that BrowserStack had messed something up or something, so I tried testing my MacOS localhost on my virtual machine (Parallels Desktop) running Windows 10, but also this was impossible. I couldn't connect to the IP. At this point, I started getting a little frustrated. I started Googling around for answers. I blamed it on Parallels for not letting the connection go through. And then... suddenly in some weird Parallels forum thread, I found the answer. It wasn't related to Parallels at all, instead the issue was related to webpack-dev-server 🤯 Apparently webpack-dev-server had stopped allowing remote connections. The fix was to set the host option in the devServer object in the config. Like this: