web3modal error during Wallet Connect function for web3 in javascript

Question

i try to follow github web3modal guide to con figure my wallet connect in javascript . pls help me on this issue. appreciate

https://github.com/Web3Modal/web3modal-vanilla-js-example

html

  <button id="connectBtn" class="mint-btn btn-s" onclick="connectWallet"><span id="connectContent">connect wallet</span></button>
          </div>

<script src="./js/main.js"></script>
<script src="lib/ethers-5.2.umd.min.js" type="application/javascript"></script>

<script src="https://unpkg.com/web3@latest/dist/web3.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/web3modal"></script>
<script type="text/javascript" src="https://unpkg.com/evm-chains/lib/index.js"></script>
<script type="text/javascript" src="https://unpkg.com/@walletconnect/web3-provider"></script>

main.js

    async function connectWallet() {
    
      const instance = await web3Modal.connect();
      const provider = new ethers.providers.Web3Provider(instance);
      const signer = provider.getSigner();
     
    
      // const provider = new ethers.providers.Web3Provider(window.ethereum)
      const network = await provider.getNetwork()
      console.log('network: ', network.name);
    
      const providerOptions = {
        /* See Provider Options Section */
      };
      
      const web3Modal = new Web3Modal({
        network: "mainnet", // optional
        cacheProvider: true, // optional
        providerOptions // required
      });
}

Package.json

{
  "dependencies": {
    "web3modal": "^1.9.8"
  }
}

my purpose to have this wallet provider option to pop when click on "connect wallet"

Below is error am encounter .

Updated Hi Sir， after chg still encounter same error.

Answer 1

Ok, I've tried your code and you're calling the connect method of web3Modal in const instance = await web3Modal.connect(); but you declare it some lines later in const web3Modal = new Web3Modal(options);. That's the reason why you're getting this error. I've found this repo in which the connection is made with the same packages you are using. I recommend you taking a look to it and if you keep with problems don't doubt in asking again ser :)