Webpack proxy not working in Quasar V2

I have just updated to the latest v2 beta:

"@quasar/extras": "^1.10.2" -> "@quasar/extras": "^1.10.5",
"quasar": "^2.0.0-beta.12" -> "quasar": "^2.0.0-beta.19",
"@quasar/app": "^3.0.0-beta.15", -> "@quasar/app": "^3.0.0-beta.28",

On both versions I have the following config in my quasar.conf.js

    devServer: {
      https: false,
      host: '0.0.0.0',
      public: '0.0.0.0:8081',
      port: 8081,
      open: true // opens browser window automatically
    },

I then start Quasar with the command quasar dev -p 8082.

It is used because my development environment has NGINX in front of it and routes all traffic to the Quasar Dev instance through port 8081, proxying to port 8082. By having the public variable set, I have been able to allow my development environment to communicate for hot reload through this proxy.

Since the update though, it doesn’t appear to be recognising the proxy. Even with the public proxy variable set, I get the error in the console:

Firefox can’t establish a connection to the server at ws://localhost:8082/ws.

[maggie0002]

I see that Quasar webpack-dev-server has been bumped to version v4. I installed the latest version, followed the webpack-dev-server migration guide (https://github.com/webpack/webpack-dev-server/blob/master/migration-v4.md) and now the issue is resolved. Thanks.

[yusufkandemir]

Webpack has been upgraded from v4 to v5 in @quasar/app v3.0.0-beta.16, which also means webpack-dev-server is upgraded to match the next major Webpack version. Please see the upgrade guide. So, that is why you experienced some changes.

I am not sure if anything is consciously changed about this, or this is a bug. But the public option got replaced by webSocketURL, but it’s not released yet. And it looks like the new usage is now like this(according to https://github.com/webpack/webpack-dev-server/pull/3309/files#diff-3f93c6a4c6fa5ed06e1d75bb4e0661b277bbe5b06c0df8828684ce405b10fa9c):

- public: 'https://localhost:8080',
+ client: {
+   webSocketURL: 'ws://localhost:8080',
+ },

So, ideally, you would file a ticket to them, but since they removed this option that would be useless. I guess we need to wait until they release a new version with these changes and test if it’s working or not, then move accordingly.

So, from our side, when the Webpack team releases this change and updates their documentation, we would just need to bump the package and document this change in our docs as the public option is currently documented in our dev server docs.

For reference: https://github.com/webpack/webpack-dev-server/pull/3181 https://github.com/webpack/webpack-dev-server/pull/3350 https://github.com/webpack/webpack-dev-server/pull/3309