Cannot access "child_process.spawn" in client code, with Vite 3.0 and Socket 2.5.0

Describe the bug Issue with xmlhttprequest-ssl and vite 3.0 when doing vite or vite build & vite preview

To Reproduce Socket.IO client version: 2.5.0 Vite version: 3.0 React version: 18.2.0

Client We set the socket connection in abstract way with react-query. The connection part looks pretty the same as your example with some tweaks, but the issue is probably deeper inside the package xmlhttprequest-ssl

import { io } from "socket.io-client";

const _socket = io(`${import.meta.env.VITE_WSS_URL}`, {
  query: {
    pathname: window.location.pathname,
    sw: window.innerWidth,
    sh: window.innerHeight,
    b: browser?.name,
    token: response.token,
    p: 'example',
  },
  transports: ['websocket'],
});

Expected behavior The socket connection should be successfully established, and we should receive events

Platform:

• Chromium 102

Additional context As an error we receive

browser-external:child_process:9 Uncaught Error: Module "child_process" has been externalized for browser compatibility. Cannot access "child_process.spawn" in client code.

which leads us to It also might be connected with new Vite’s websocket connection strategy https://vitejs.dev/blog/announcing-vite3.html#dev-improvements

[Luff-JM]

try to use @esbuild-plugins/node-modules-polyfill

vite.config.ts as follow

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import { NodeModulesPolyfillPlugin } from "@esbuild-plugins/node-modules-polyfill";

export default defineConfig({
  plugins: [react()],
  optimizeDeps: {
    esbuildOptions: {
      plugins: [NodeModulesPolyfillPlugin()],
    },
  },
});

[darrachequesne]

OK, so this should fix the issue: https://github.com/socketio/engine.io-client/commit/280de368092b17648b59b7467fa49f2425edcd45

Included in engine.io-client@3.5.3, which should be transitively imported by socket.io-client@2.5.0.

Can anyone confirm please?