404 with https://myapp.com:9000/sockjs-node/info?xxxx related to HMR when the base url for vue is changed to "/xxxx" instead of "/"

[hemanthgk10]

Version

2.6.11

Reproduction link

https://github.com/hemanthgk10/dummy-dashboard

Steps to reproduce

1. Create a vue-app with command vue create myapp.
2. Add an nginx infront of it and have a config routing traffic to vue app on "/xxxx" anything apart from default "/". Nginx have certs created to run on https on port 5443.
3. Change the baseUrl / Publicpath to "/xxx/" , have https enabled in the config and public set to https://myapp.com:5443 in vue.config.js
4. As soon as the app launches it the browser throws the error in the console logs about the sockjs-node 404 error fetch the hot reload status failing as it is looking at path "/" instead of "/xxxx".

What is expected?

Expected that by default the HMR should be checking on "/xxx" instead of "/"

What is actually happening?

websocket connecting is trying to fetch the HMR status on "/" and fails with 404

---

I see that react has a refresh webpack plugin
pmmmwh/react-refresh-webpack-plugin#43
webpack/webpack-dev-server#1385

I know this is not an issue with Vue but, is there a way to workaround this issue in vue app. I do have the hot: false in vue.config.js but that didn't help from this error.

sockjs.js?9be2:1606 POST https://myapp.com:5443/sockjs-node/112/toqico1s/xhr_streaming?t=1588543366318 404 (Not Found)
GET https://myapp.com:5443/sockjs-node/498/k1oc5slc/eventsource 404 ( Not Found )

[posva]

Hi, thanks for your interest but Github issues are for bug reports and feature requests only. You can ask questions on the forum, the Discord server or StackOverflow.

---

As you pointed out yourself, this is not directly related to Vue

[hemanthgk10]

@posva thanks for looking into it. But there should be a way to avoid this error in vue.js as it is coming from Vue HMR, as you can see my project is not using webpack directly.