how to fix error Module not found: Error: Can't resolve 'crypto' after using xlsx-populate in React JS

I've just started getting this error since I used the xlsx-populate package in my React JS app..

Compiled with problems:

ERROR in ./node_modules/xlsx-populate/lib/Encryptor.js 14:15-32

Module not found: Error: Can't resolve 'crypto' in 'C:\xampp\htdocs\lolighaya01\node_modules\xlsx-populate\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: { "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/xlsx-populate/lib/Workbook.js 5:11-24

Module not found: Error: Can't resolve 'fs' in 'C:\xampp\htdocs\lolighaya01\node_modules\xlsx-populate\lib'

I searched but everybody says the solution is to add this code in the package.json file after devDependencies

  },
  "browser": {
    "crypto": false
  }

I also tried installing crypto-browserify. but none of these solution work for me.