Unable to import socket.io-client with React

[TheAschr]

Steps to reproduce:

1. Create a new react project with npx create-react-app my-app --template=typescript.
2. Run cd my-app
3. Add socket.io-client to project by running "npm i socket.io-client"
4. Import the library using import io from 'socket.io-client'; anywhere in a .tsx file
5. Create a socket.io client using io("/socket.io"); using that same .tsx file
6. Run npm start

Result:

Failed to parse source map from '/home/alex/Documents/Code/socketio-compat/node_modules/src/index.ts' file: Error: ENOENT: no such file or directory, open '/home/alex/Documents/Code/socketio-compat/node_modules/src/index.ts'
 @ ./node_modules/engine.io-parser/build/esm/decodePacket.browser.js 2:0-44 38:20-26
 @ ./node_modules/engine.io-parser/build/esm/index.js 2:0-45 27:26-38 39:0-68
 @ ./node_modules/engine.io-client/build/esm/socket.js 6:0-44 113:16-24 586:18-26
 @ ./node_modules/engine.io-client/build/esm/index.js 1:0-37 2:0-18 3:24-39
 @ ./node_modules/socket.io-client/build/esm/manager.js 1:0-75 23:4-25 116:22-28
 @ ./node_modules/socket.io-client/build/esm/index.js 2:0-39 26:13-20 29:22-29 45:2-9 63:0-79
 @ ./src/index.tsx 9:0-34 11:0-2

Example repository:

https://github.com/TheAschr/socketio-compat

[darrachequesne]

Related: https://github.com/niklasvh/base64-arraybuffer/issues/32

[mario-hess]

Is there any fix to it?

[darrachequesne]

@coco-nebula please see https://github.com/socketio/socket.io-client/issues/1520#issuecomment-1008622475

[darrachequesne]

This should be fixed by https://github.com/socketio/base64-arraybuffer/commit/d30e7cc877d6fd68555856b611e3f22940b00f4d, included in engine.io-parser@5.0.3 (and thus in latest socket.io-client version, as it is a transitive dependency).