Errors in React and @waku/sdk #1415

agazso · 2023-07-03T13:07:54Z

This is a bug report

Problem

I want to build a frontend app using React (create-react-app) and Waku, but currently I get a lot of unresolved modules errors from the different dependencies (see below) and I could not find out from the examples or the documentation how to fix it.

There are React examples and they work, but with seemingly the same version of React and other dependencies. However if I remove the package-lock.json file from the examples and do npm install then they also display the same errors.

It is completely possible that I am doing something wrong, or I am missing an obvious step to do. In that case it would be good to know that and add to the documentation. I also ran into similar problems with Vite based projects (Preact, Vue, Svelte) but that may be a discussion in another issue.

The commands I used:

npx create-react-app waku-react-example
cd waku-react-example
npm install
npm i -s @waku/sdk

# add the modifications from the repo
npm start

See the repo here:
https://github.com/agazso/waku-react-example

Notes

js-waku version: 0.0.16
Environment: Node version v16.20.0, npm version 8.19.4

Failed to compile.

Module not found: Error: Can't resolve 'timers' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/ssdp/node_modules/xml2js/lib'
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "timers": require.resolve("timers-browserify") }'
	- install 'timers-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "timers": false }
WARNING in ./node_modules/sax/lib/sax.js 139:13-37
Module not found: Error: Can't resolve 'stream' in '/home/attila/Projects/LogosLab/waku-react/node_modules/sax/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
	- install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "stream": false }

ERROR in ./node_modules/@achingbrain/ssdp/node_modules/xml2js/lib/parser.js 35:17-47
Module not found: Error: Can't resolve 'timers' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/ssdp/node_modules/xml2js/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "timers": require.resolve("timers-browserify") }'
	- install 'timers-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "timers": false }

ERROR in ./node_modules/cross-spawn/index.js 3:11-35
Module not found: Error: Can't resolve 'child_process' in '/home/attila/Projects/LogosLab/waku-react/node_modules/cross-spawn'

ERROR in ./node_modules/cross-spawn/lib/parse.js 3:13-28
Module not found: Error: Can't resolve 'path' in '/home/attila/Projects/LogosLab/waku-react/node_modules/cross-spawn/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
	- install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "path": false }

ERROR in ./node_modules/cross-spawn/lib/util/readShebang.js 3:11-24
Module not found: Error: Can't resolve 'fs' in '/home/attila/Projects/LogosLab/waku-react/node_modules/cross-spawn/lib/util'

ERROR in ./node_modules/cross-spawn/lib/util/resolveCommand.js 3:13-28
Module not found: Error: Can't resolve 'path' in '/home/attila/Projects/LogosLab/waku-react/node_modules/cross-spawn/lib/util'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
	- install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "path": false }

ERROR in ./node_modules/default-gateway/android.js 5:4-18
Module not found: Error: Can't resolve 'net' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

ERROR in ./node_modules/default-gateway/darwin.js 5:4-18
Module not found: Error: Can't resolve 'net' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

ERROR in ./node_modules/default-gateway/darwin.js 8:4-17
Module not found: Error: Can't resolve 'os' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
	- install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "os": false }

ERROR in ./node_modules/default-gateway/freebsd.js 5:4-18
Module not found: Error: Can't resolve 'net' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

ERROR in ./node_modules/default-gateway/index.js 6:4-17
Module not found: Error: Can't resolve 'os' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
	- install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "os": false }

ERROR in ./node_modules/default-gateway/linux.js 5:4-18
Module not found: Error: Can't resolve 'net' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

ERROR in ./node_modules/default-gateway/linux.js 8:4-17
Module not found: Error: Can't resolve 'os' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
	- install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "os": false }

ERROR in ./node_modules/default-gateway/openbsd.js 5:4-18
Module not found: Error: Can't resolve 'net' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

ERROR in ./node_modules/default-gateway/sunos.js 5:4-18
Module not found: Error: Can't resolve 'net' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

ERROR in ./node_modules/default-gateway/win32.js 5:4-18
Module not found: Error: Can't resolve 'net' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

ERROR in ./node_modules/default-gateway/win32.js 8:4-17
Module not found: Error: Can't resolve 'os' in '/home/attila/Projects/LogosLab/waku-react/node_modules/default-gateway'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
	- install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "os": false }

ERROR in ./node_modules/execa/index.js 3:13-28
Module not found: Error: Can't resolve 'path' in '/home/attila/Projects/LogosLab/waku-react/node_modules/execa'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
	- install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "path": false }

ERROR in ./node_modules/execa/index.js 4:21-45
Module not found: Error: Can't resolve 'child_process' in '/home/attila/Projects/LogosLab/waku-react/node_modules/execa'

ERROR in ./node_modules/execa/lib/kill.js 3:11-24
Module not found: Error: Can't resolve 'os' in '/home/attila/Projects/LogosLab/waku-react/node_modules/execa/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
	- install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "os": false }

ERROR in ./node_modules/get-stream/buffer-stream.js 5:4-21
Module not found: Error: Can't resolve 'stream' in '/home/attila/Projects/LogosLab/waku-react/node_modules/get-stream'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
	- install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "stream": false }

ERROR in ./node_modules/get-stream/index.js 5:4-21
Module not found: Error: Can't resolve 'buffer' in '/home/attila/Projects/LogosLab/waku-react/node_modules/get-stream'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "buffer": require.resolve("buffer/") }'
	- install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "buffer": false }

ERROR in ./node_modules/get-stream/index.js 6:15-32
Module not found: Error: Can't resolve 'stream' in '/home/attila/Projects/LogosLab/waku-react/node_modules/get-stream'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
	- install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "stream": false }

ERROR in ./node_modules/get-stream/index.js 9:4-19
Module not found: Error: Can't resolve 'util' in '/home/attila/Projects/LogosLab/waku-react/node_modules/get-stream'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "util": require.resolve("util/") }'
	- install 'util'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "util": false }

ERROR in ./node_modules/human-signals/build/src/main.js 7:10-23
Module not found: Error: Can't resolve 'os' in '/home/attila/Projects/LogosLab/waku-react/node_modules/human-signals/build/src'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
	- install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "os": false }

ERROR in ./node_modules/human-signals/build/src/signals.js 7:10-23
Module not found: Error: Can't resolve 'os' in '/home/attila/Projects/LogosLab/waku-react/node_modules/human-signals/build/src'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
	- install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "os": false }

ERROR in ./node_modules/isexe/index.js 1:9-22
Module not found: Error: Can't resolve 'fs' in '/home/attila/Projects/LogosLab/waku-react/node_modules/isexe'

ERROR in ./node_modules/isexe/mode.js 3:9-22
Module not found: Error: Can't resolve 'fs' in '/home/attila/Projects/LogosLab/waku-react/node_modules/isexe'

ERROR in ./node_modules/isexe/windows.js 3:9-22
Module not found: Error: Can't resolve 'fs' in '/home/attila/Projects/LogosLab/waku-react/node_modules/isexe'

ERROR in ./node_modules/merge-stream/index.js 5:4-21
Module not found: Error: Can't resolve 'stream' in '/home/attila/Projects/LogosLab/waku-react/node_modules/merge-stream'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
	- install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "stream": false }

ERROR in ./node_modules/npm-run-path/index.js 3:13-28
Module not found: Error: Can't resolve 'path' in '/home/attila/Projects/LogosLab/waku-react/node_modules/npm-run-path'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
	- install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "path": false }

ERROR in ./node_modules/safe-buffer/index.js 3:13-30
Module not found: Error: Can't resolve 'buffer' in '/home/attila/Projects/LogosLab/waku-react/node_modules/safe-buffer'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "buffer": require.resolve("buffer/") }'
	- install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "buffer": false }

ERROR in ./node_modules/signal-exit/index.js 17:15-32
Module not found: Error: Can't resolve 'assert' in '/home/attila/Projects/LogosLab/waku-react/node_modules/signal-exit'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "assert": require.resolve("assert/") }'
	- install 'assert'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "assert": false }

ERROR in ./node_modules/which/which.js 2:13-28
Module not found: Error: Can't resolve 'path' in '/home/attila/Projects/LogosLab/waku-react/node_modules/which'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
	- install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "path": false }

ERROR in ./node_modules/xml2js/lib/parser.js 36:17-47
Module not found: Error: Can't resolve 'timers' in '/home/attila/Projects/LogosLab/waku-react/node_modules/xml2js/lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "timers": require.resolve("timers-browserify") }'
	- install 'timers-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "timers": false }

ERROR in ./node_modules/@achingbrain/nat-port-mapper/dist/src/index.js 1:0-20
Module not found: Error: Can't resolve 'os' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/nat-port-mapper/dist/src'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
	- install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "os": false }

ERROR in ./node_modules/@achingbrain/nat-port-mapper/dist/src/pmp/index.js 1:0-37
Module not found: Error: Can't resolve 'dgram' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/nat-port-mapper/dist/src/pmp'

ERROR in ./node_modules/@achingbrain/nat-port-mapper/dist/src/upnp/fetch.js 1:0-24
Module not found: Error: Can't resolve 'http' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/nat-port-mapper/dist/src/upnp'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }'
	- install 'stream-http'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "http": false }

ERROR in ./node_modules/@achingbrain/nat-port-mapper/dist/src/upnp/fetch.js 2:0-26
Module not found: Error: Can't resolve 'https' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/nat-port-mapper/dist/src/upnp'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }'
	- install 'https-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "https": false }

ERROR in ./node_modules/@achingbrain/ssdp/dist/src/advertise/create-location.js 1:0-24
Module not found: Error: Can't resolve 'http' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/ssdp/dist/src/advertise'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }'
	- install 'stream-http'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "http": false }

ERROR in ./node_modules/@achingbrain/ssdp/dist/src/advertise/find-all-interfaces.js 1:0-20
Module not found: Error: Can't resolve 'os' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/ssdp/dist/src/advertise'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "os": require.resolve("os-browserify/browser") }'
	- install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "os": false }

ERROR in ./node_modules/@achingbrain/ssdp/dist/src/create-sockets.js 1:0-37
Module not found: Error: Can't resolve 'dgram' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/ssdp/dist/src'

ERROR in ./node_modules/@achingbrain/ssdp/dist/src/default-ssdp-options.js 1:0-45
Module not found: Error: Can't resolve 'crypto' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/ssdp/dist/src'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "crypto": require.resolve("crypto-browserify") }'
	- install 'crypto-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "crypto": false }

ERROR in ./node_modules/@achingbrain/ssdp/dist/src/default-ssdp-options.js 2:0-39
Module not found: Error: Can't resolve 'module' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/ssdp/dist/src'

ERROR in ./node_modules/@achingbrain/ssdp/dist/src/fetch.js 1:0-24
Module not found: Error: Can't resolve 'http' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/ssdp/dist/src'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }'
	- install 'stream-http'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "http": false }

ERROR in ./node_modules/@achingbrain/ssdp/dist/src/fetch.js 2:0-26
Module not found: Error: Can't resolve 'https' in '/home/attila/Projects/LogosLab/waku-react/node_modules/@achingbrain/ssdp/dist/src'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }'
	- install 'https-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "https": false }

ERROR in ./node_modules/freeport-promise/dist/src/index.js 1:0-35
Module not found: Error: Can't resolve 'net' in '/home/attila/Projects/LogosLab/waku-react/node_modules/freeport-promise/dist/src'

webpack compiled with 46 errors and 1 warning

The text was updated successfully, but these errors were encountered:

agazso · 2023-07-03T16:51:54Z

One clue I found is that the relay-reactjs-chat example uses a tool called craco that is used to override the configuration of the default create-react-app:

https://github.com/waku-org/js-waku-examples/blob/bc0d8113f79c81d05d1ea192ed122f05f9a16032/examples/relay-reactjs-chat/package.json#L46

fryorcraken · 2023-07-06T10:44:55Z

craco is only needed when using createRelayNode because it uses @chainsafe/libp2p-gossipsub that has a CJS module .cjs and react-scripts does not include these files in the default webpack config.

Craco should not be fixing the polyfills AFAIK. Indeed, this is bad that they are so many polyfills, not sure how we did not notice them before.

fryorcraken · 2023-07-18T03:58:01Z

We expect #1400 to help with this.

weboko · 2023-07-25T23:50:14Z

Locally I can confirm that #1400 fixes the issue, and the next release (#1410) will bring the fix. ETA is tomorrow

weboko · 2023-07-26T19:59:41Z

@agazso can you try @waku/[email protected] and tell if it resolves your issue, please?

agazso · 2023-07-27T08:55:40Z

I can confirm that with @waku/[email protected] the errors are gone and it works correctly. Thank you!

There are some new warnings, I am not sure if they cause any problems, but I copy here in case you want to investigate further:

Compiled with warnings.

Failed to parse source map from '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/is-ip.ts' file: Error: ENOENT: no such file or directory, open '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/is-ip.ts'

Failed to parse source map from '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/parse.ts' file: Error: ENOENT: no such file or directory, open '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/parse.ts'

Failed to parse source map from '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/parser.ts' file: Error: ENOENT: no such file or directory, open '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/parser.ts'

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

WARNING in ./node_modules/@chainsafe/is-ip/lib/is-ip.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/is-ip.ts' file: Error: ENOENT: no such file or directory, open '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/is-ip.ts'

WARNING in ./node_modules/@chainsafe/is-ip/lib/parse.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/parse.ts' file: Error: ENOENT: no such file or directory, open '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/parse.ts'

WARNING in ./node_modules/@chainsafe/is-ip/lib/parser.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/parser.ts' file: Error: ENOENT: no such file or directory, open '/home/attila/Projects/LogosLab/waku-react-example2/node_modules/@chainsafe/is-ip/src/parser.ts'

webpack compiled with 3 warnings

weboko · 2023-07-27T09:08:00Z

@agazso great, thank you for checking!

for the source maps problem, I guess maybe re-configuring might help. I also observed them in one of our examples but didn't investigate them.

note: we still have some problems with browser incompatible packages, issue on libp2p side

not resolving this issue till I investigate the other problem

weboko · 2023-07-31T08:45:24Z

Closed as issue is resolved and the one observed in web-chat was due to another problem.

fryorcraken added this to Waku Jul 6, 2023

fryorcraken added bug Something isn't working critical This issue needs critical attention labels Jul 6, 2023

fryorcraken moved this to Priority in Waku Jul 6, 2023

fryorcraken pinned this issue Jul 18, 2023

weboko moved this from Priority to In Progress in Waku Jul 25, 2023

weboko self-assigned this Jul 25, 2023

weboko moved this from In Progress to Code Review / QA in Waku Jul 25, 2023

This was referenced Jul 27, 2023

(re)investigate gauging peer disconnections with js-waku #1412

Closed

Dogfood peer-exchange curation in web-chat example #1309

Closed

[Connection Manager] Improve fallback mechanism when remote peer rejects connection #1326

Closed

weboko closed this as completed Jul 31, 2023

github-project-automation bot moved this from Code Review / QA to Done in Waku Jul 31, 2023

fryorcraken mentioned this issue Aug 7, 2023

Optimize js-waku for the Browser #337

Open

15 tasks

fbarbu15 unpinned this issue Sep 22, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Errors in React and @waku/sdk #1415

Errors in React and @waku/sdk #1415

agazso commented Jul 3, 2023 •

edited

Loading

agazso commented Jul 3, 2023 •

edited

Loading

fryorcraken commented Jul 6, 2023

fryorcraken commented Jul 18, 2023

weboko commented Jul 25, 2023

weboko commented Jul 26, 2023

agazso commented Jul 27, 2023

weboko commented Jul 27, 2023

weboko commented Jul 31, 2023

Errors in React and @waku/sdk #1415

Errors in React and @waku/sdk #1415

Comments

agazso commented Jul 3, 2023 • edited Loading

Problem

Notes

agazso commented Jul 3, 2023 • edited Loading

fryorcraken commented Jul 6, 2023

fryorcraken commented Jul 18, 2023

weboko commented Jul 25, 2023

weboko commented Jul 26, 2023

agazso commented Jul 27, 2023

weboko commented Jul 27, 2023

weboko commented Jul 31, 2023

agazso commented Jul 3, 2023 •

edited

Loading

agazso commented Jul 3, 2023 •

edited

Loading