Web3-react错误模块分析失败:意外令牌您可能需要适当的加载器来处理此文件类型。web3-react/walletconnect

Question

当我尝试使用web3-react/core集成web2-react/walletconnect-connector与web3-react时。其他钱包，如portis，metamask，fortmatic和少数几个都工作正常，但当我使用wallet-connector或walletlink时，它会给出错误。我使用了这个代码web3-react github repo。获取运行时错误。

提供程序

import {
    Web3ReactProvider,
} from '@web3-react/core';
import { Web3Provider } from '@ethersproject/providers';

function getLibrary(provider: any) {
    const library = new Web3Provider(provider);
    library.pollingInterval = 12000;
    return library;
}
ReactDOM.render(
    <Web3ReactProvider getLibrary={getLibrary} >
        <Start />
    </Web3ReactProvider>,
    document.getElementById('root') as HTMLElement
);

连接器代码

import { WalletConnectConnector } from '@web3-react/walletconnect-connector';
export const walletconnect = new WalletConnectConnector({
    rpc: { 1: 'https://mainnet.infura.io/v3/84842078b09946638c03157f83405213' },
    qrcode: true,
});

下面是错误

./node_modules/eth-json-rpc-filters/node_modules/pify/index.js
Module parse failed: Unexpected token (44:2)
You may need an appropriate loader to handle this file type.
|               errorFirst: true,
|               promiseModule: Promise,
|               ...options
|       };

包Json

 { 
 "name": "my-app",
 "version": "0.1.0",
    "private": true,
    "dependencies": {
        "@ant-design/icons": "^2.1.1",
        "@ethersproject/keccak256": "^5.4.0",
        "@ethersproject/providers": "^5.4.5",
        "@ethersproject/units": "^5.4.0",
        "@metamask/detect-provider": "^1.2.0",
        "@web3-react/abstract-connector": "^6.0.7",
        "@web3-react/authereum-connector": "^6.2.0",
        "@web3-react/core": "^6.1.9",
        "@web3-react/fortmatic-connector": "^6.1.6",
        "@web3-react/frame-connector": "^6.0.9",
        "@web3-react/injected-connector": "^6.0.7",
        "@web3-react/lattice-connector": "^6.1.9",
        "@web3-react/ledger-connector": "^6.1.9",
        "@web3-react/network-connector": "^6.1.9",
        "@web3-react/portis-connector": "^6.1.9",
        "@web3-react/squarelink-connector": "^6.1.9",
        "@web3-react/torus-connector": "^6.1.9",
        "@web3-react/trezor-connector": "^6.1.9",
        "@web3-react/walletconnect-connector": "^6.2.4",
        "@web3-react/walletlink-connector": "^6.2.5",
        "antd": "^3.4.1",
        "async-redis": "^2.0.0",
        "bootstrap": "^5.1.0",
        "bscscan-api": "^1.0.1",
        "chessboardjs": "^0.0.1",
        "dotenv": "^4.0.0",
        "ethers": "^5.4.6",
        "express": "^4.16.3",
        "husky": "^7.0.2",
        "immutable": "^3.8.2",
        "lint-staged": "^11.1.2",
        "node-cron": "^3.0.0",
        "node-schedule": "^1.3.0",
        "nodemon": "^2.0.13",
        "normalize.css": "^8.0.0",
        "prettier": "^2.3.2",
        "react": "^16.3.1",
        "react-copy-to-clipboard": "^5.0.4",
        "react-countdown-circle-timer": "^2.5.4",
        "react-dom": "^16.3.1",
        "react-router": "^5.2.1",
        "react-router-dom": "^5.3.0",
        "react-scripts-ts": "^2.15.1",
        "react-spring": "^9.2.5",
        "react-toastify": "^8.0.3",
        "redis": "^2.8.0",
        "shortid": "^2.2.8",
        "socket.io": "^2.1.0",
        "socket.io-client": "^2.1.0",
        "toasted-notes": "^3.2.0",
        "web3": "^1.6.0"
    },
    "scripts": {
        "start": "react-scripts-ts start",
        "server": "server/index.js",
        "nodemon": "nodemon server/index.js",
        "build": "react-scripts-ts build",
        "test": "react-scripts-ts test --env=jsdom",
        "eject": "react-scripts-ts eject",
        "create:component": "./node_modules/hygen/lib/bin.js component create",
        "create:store:item": "./node_modules/hygen/lib/bin.js store create",
        "heroku-postbuild": "yarn run build"
    },
    "jest": {
        "moduleNameMapper": {
            "^react-native$": "react-native-web",
            "@App/(.*)": "<rootDir>/src/$1"
        }
    },
    "devDependencies": {
        "@types/history": "^4.6.2",
        "@types/jest": "^22.2.2",
        "@types/node": "^9.6.2",
        "@types/react-dom": "^16.0.4",
        "typescript": "^2.9.2"
    }
 }

我尝试了大约3天，但仍然没有成功。请帮我弄一下这个。

Answer 1

在为他们降级一个版本后，它能够再次工作。

Answer 2

我在vue项目中，构建/webpack.base.conf.js添加

{
    test: /\.js$/,
    loader: 'babel-loader',
    include: [
      resolve('src'),
      resolve('test'),
      resolve('node_modules/webpack-dev-server/client'),
      resolve('node_modules/web3-eth-accounts/lib'),
      resolve('node_modules/web3-core-helpers/lib'),
      resolve('node_modules/web3-eth-contract/lib'),
      resolve('node_modules/web3-core-method/lib')
    ]
  },

错误原因是web3.js语法不支持{...options，...otherOptions}，它是

Object.assing(options, {
    a: 'xxx',
    b: 'xxx
})