umi 启动 npm run dev 之后页面一直提示 Disconnect 不断刷新重连前端开发

场景前端使用 antd pro 的脚手架项目，运行 npm run start 启动 devServer 进行热加载实时打包。
后端使用 koa 来提供 API 接口和中间件，并且使用 HTML 引用前端的打包资源来进行页面渲染。
问题 【umi 启动 npm run dev 之后页面一直提示 Disconnect 不断刷新重连】由于同时起了 devServer 和 node 两个端口服务，所以当我访问后端渲染页面时，umi 中的 socket server 端口指向错误。所以它会不断地重连。
解决方案修改前端启动命令关闭 socket server：

"start": "npm run clear && cross-env APP_TYPE=site PORT=8899 SOCKET_SERVER=none umi dev", "start:no-mock": "cross-env MOCK=none PORT=8899 SOCKET_SERVER=none umi dev",

为什么可以这样？看代码:当 SOCKET_SERVER 为 none 时就不会走 socket server 这一段。

// Connect to WebpackDevServer via a socket. if (process.env.SOCKET_SERVER !== 'none') { socket( process.env.SOCKET_SERVER ? `${stripLastSlash(process.env.SOCKET_SERVER)}/sockjs-node` : url.format({ protocol: window.location.protocol, hostname: window.location.hostname, port: window.location.port, // Hardcoded in WebpackDevServer pathname: '/sockjs-node', }), { onclose() { if ( typeof console !== 'undefined' && typeof console.info === 'function' ) { console.info( 'The development server has disconnected.\nRefresh the page if necessary.', ); } }, onmessage(e) { var message = JSON.parse(e.data); switch (message.type) { case 'hash': handleAvailableHash(message.data); break; case 'still-ok': case 'ok': handleSuccess(); break; case 'content-changed': // Triggered when a file from `contentBase` changed. window.location.reload(); break; case 'warnings': handleWarnings(message.data); break; case 'errors': handleErrors(message.data); break; default: // Do nothing. } }, }, ); }

最后这个问题卡了我好久，所以记录下来希望能帮到别人~