Webpack 5 Pollyfill Error

I posted this Issue on GitHub for a bug in PeraWallet Connect. However, the PeraWallet team has been unable to solve it. Maybe @Taylan can help.

The error is:

ERROR in ./node_modules/algosdk/dist/browser/algosdk.min.js 7206:55-72

Module not found: Error: Can't resolve 'crypto' in '/Users/fortiorb/Desktop/Programming/Connect/node_modules/algosdk/dist/browser

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 }

This purported fix does not work. This purported fix does not work.

One problem is I can’t find the path to: Desktop/Programming/Connect/node_modules/algosdk. This is strange because the algosdk should not be in the node_modules folder. So, it isn’t clear where this error is coming from, whether it is an AlgoSDK error, a PeraWalletConnect error, or a React error.

I am lost on how to resolve this bug, in large part because I don’t know what a polyfill is or why it is used. Ultimately, I’d appreciate any advice or guidance on what is causing this error and how to fix it.

Update

Issue reported on GitHub.

Solution

The solution is on StackOverFlow.

Add:
"crypto": require.resolve("crypto-browserify"),

In:
node_modules/react-scripts/config/webpack.config.js