我正在使用Webpack构建React前端，同时将后端作为一个单独的进程运行，并使用Webpack开发服务器将请求代理到后端。常规API请求代理服务器很好，但当我尝试使用ws: true选项添加任何代理服务器时，在加载本地主机上Webpack开发服务器提供的页面后，我开始得到以下错误和每秒重复的堆栈跟踪。

<i> [webpack-dev-server] [HPM] Upgrading to WebSocket
<e> [webpack-dev-server] [HPM] WebSocket error: Error [ERR_STREAM_WRITE_AFTER_END]: write after end
<e>     at new NodeError (node:internal/errors:372:5)
<e>     at _write (node:internal/streams/writable:319:11)
<e>     at Socket.Writable.write (node:internal/streams/writable:334:10)
<e>     at Sender.sendFrame (C:\code\line-up\line-up-client\node_modules\ws\lib\sender.js:469:20)
<e>     at Sender.close (C:\code\line-up\line-up-client\node_modules\ws\lib\sender.js:197:12)
<e>     at WebSocket.close (C:\code\line-up\line-up-client\node_modules\ws\lib\websocket.js:300:18)
<e>     at Receiver.receiverOnConclude (C:\code\line-up\line-up-client\node_modules\ws\lib\websocket.js:1114:18)
<e>     at Receiver.emit (node:events:527:28)
<e>     at Receiver.controlMessage (C:\code\line-up\line-up-client\node_modules\ws\lib\receiver.js:582:14)
<e>     at Receiver.getData (C:\code\line-up\line-up-client\node_modules\ws\lib\receiver.js:429:42) {
<e>   code: 'ERR_STREAM_WRITE_AFTER_END'
<e> }

我的代理配置如下：

proxy: {
    '/api/*': {
        target: 'http://localhost:5150',
        pathRewrite: { '^/api': '' },
    },
    '/ws': {
        target: 'ws://localhost:5150',
        ws: true,
    }
},

我的后端侦听http://localhost:5150上的常规HTTP API请求，WebSocket端点位于localhost:5150/ws。
我尝试过的事情：

• 将/ws代理的目标设置为使用http协议。
• 将/ws代理的目标设置为转到/ws路径。
• 在两个代理对象上设置ws: true。
• 各种其他排列。

我的客户端源代码不是启动失败的WebSocket连接的源代码，该代码被删除，错误仍然存在。
下面是我的package.json中的一段摘录，显示了相关的版本：

"webpack": "^5.72.1",
"webpack-cli": "^4.9.2",
"webpack-dev-server": "^4.9.0"

编辑：
我尝试代理Webpack dev服务器用于执行HMR的路径时，会出现错误循环。将配置和端点更改为使用/websocket而不是/ws，并将代理更改为：

'/websocket': {
    target: 'http://localhost:5150',
    ws: true,
}

我在客户端得到了一个WebSocket连接错误。我有一个静态的vanilla JS页面，我用来测试没有Webpack的后端，它工作正常，所以我认为问题是与Webpack/客户端代码的地方。