Angular 12 seems to have migrated to Webpack 5 and that seems to make the build using erdJs not work, at least in my case.
I've managed to find a few workarounds, including installing crypto-browserify, stream-browserify and path-browserify and using those in my tsconfig.json paths but I still seem to be missing "fs" and getting this Error when running ng build or ng serve
/node_modules/@elrondnetwork/bls-wasm/bls_c.js:54:30-43 - Error: Module not found: Error: Can't resolve 'fs' in '...\node_modules\@elrondnetwork\bls-wasm'.
This error occurs 5 times in 4 other files located in erdjs:
@elrondnetwork/erdjs/out/smartcontracts/code.js:35:24-37
@elrondnetwork/erdjs/out/smartcontracts/typesystem/abiRegistry.js:35:24-37
@elrondnetwork/erdjs/out/smartcontracts/wrapper/contractWrapper.js:17:29-42
@elrondnetwork/erdjs/out/testutils/wallets.js:32:24-37
Does anybody know how to make erdJs work with Angular 12?
For others coming to this question in the future. Currently there is no way to use the erdjs npm package in an angular project.
The current workaround involves compiling the erdjs package to its browser version and using that as an asset in the project.
You can compile it yourself by using yarn run compile-browser
The workaround is further described and showcased here: https://github.com/ElrondNetwork/elrond-sdk-erdjs/issues/79#issuecomment-940872053