Web3 和 Angular 11 破坏了依赖关系

Question

我正在尝试使用 Angular 创建以太坊 dapp。我正在关注那篇文章：https : //medium.com/blockchain-developer/learn-how-to-create-your-own-dapp-with-angular-9-part-iv-truffle-7704dc4269ab 但是，当我添加web3 to app with npm install --save web3，并在代码中调用它，我遇到了以下问题：

Error: ./node_modules/swarm-js/node_modules/eth-lib/lib/bytes.js
Module not found: Error: Can't resolve 'crypto' in '/home/szymon/dev/dapp/node_modules/swarm-js/node_modules/eth-lib/lib'

Error: ./node_modules/web3-eth-accounts/node_modules/eth-lib/lib/bytes.js
Module not found: Error: Can't resolve 'crypto' in '/home/szymon/dev/dapp/node_modules/web3-eth-accounts/node_modules/eth-lib/lib'

Error: ./node_modules/web3-eth-accounts/src/index.js
Module not found: Error: Can't resolve 'crypto' in '/home/szymon/dev/dapp/node_modules/web3-eth-accounts/src'

Error: ./node_modules/web3-providers-http/src/index.js
Module not found: Error: Can't resolve 'http' in '/home/szymon/dev/dapp/node_modules/web3-providers-http/src'

Error: ./node_modules/xhr2-cookies/dist/xml-http-request.js
Module not found: Error: Can't resolve 'http' in '/home/szymon/dev/dapp/node_modules/xhr2-cookies/dist'

Error: ./node_modules/web3-providers-http/src/index.js
Module not found: Error: Can't resolve 'https' in '/home/szymon/dev/dapp/node_modules/web3-providers-http/src'

Error: ./node_modules/xhr2-cookies/dist/xml-http-request.js
Module not found: Error: Can't resolve 'https' in '/home/szymon/dev/dapp/node_modules/xhr2-cookies/dist'

Error: ./node_modules/xhr2-cookies/dist/xml-http-request.js
Module not found: Error: Can't resolve 'os' in '/home/szymon/dev/dapp/node_modules/xhr2-cookies/dist'

Error: ./node_modules/cipher-base/index.js
Module not found: Error: Can't resolve 'stream' in '/home/szymon/dev/dapp/node_modules/cipher-base'

Error: ./node_modules/keccak/lib/api/keccak.js
Module not found: Error: Can't resolve 'stream' in '/home/szymon/dev/dapp/node_modules/keccak/lib/api'

Error: ./node_modules/keccak/lib/api/shake.js
Module not found: Error: Can't resolve 'stream' in '/home/szymon/dev/dapp/node_modules/keccak/lib/api'

我该怎么办？Web3 是这样调用的：

let Web3 = require('web3');
export class TransferService {
    constructor() {   
      if (typeof window.web3 !== undefined) {
        this.web3 = window.web3.currentProvider;
      } else {
        this.web3 = new Web3.providers.HttpProvider('http://localhost:7545');
      }
      window.web3 = new Web3(window.ethereum);
      this.enable = this.enableMetaMaskAccount();
      }
}

Answer 1

我有同样的问题，我通过卸载 web3 并重新安装版本 1.2.11 解决了它

步骤1：npm卸载web3

步骤2：npm install web3@1.2.11

我不确定这是否会产生其他后果，但在经历了很多挫折之后，它对我有用！