Tengo este problema en una aplicación de reacción simple. Estoy tratando de conectarme a metamask usando un botón "Conectar", pero cuando hago clic en ese botón, la consola muestra un error que dice "Error: Error invariable: no se encontró <Web3ReactProvider ... />".

Como puede ver, agregué una consola a la función getLibrary y no está registrando, por lo que nunca se llama a esa función.

 import "./App.css"; import React from "react"; import { Web3ReactProvider, useWeb3React } from "@web3-react/core"; import { Web3Provider } from "@ethersproject/providers"; import { InjectedConnector } from "@web3-react/injected-connector"; const injected = new InjectedConnector({ supportedChainIds: [1, 3, 4, 5, 42], }); function getLibrary(provider) { console.log("getting library") const library = new Web3Provider(provider) library.pollingInterval = 12000 return library } const App = () => { const { active, account, library, connector, activate, deactivate } = useWeb3React(); async function connect() { console.log("connecting"); try { await activate(injected); } catch (ex) { console.log(ex); } } async function disconnect() { try { deactivate(); } catch (ex) { console.log(ex); } } return ( <Web3ReactProvider getLibrary={getLibrary}> <div className="App"> {!active ? <button onClick={connect}>Connect</button> : <button onClick={connect}>Disconnect</button>} </div> </Web3ReactProvider> ); }