getting error while using window.ethereum in Next Js with ether JS

Question

Having Issues while using the window.ethereum with NextJs new version, The window.ethereum was working fine with the NextJs 12 but when I upgraded to NextJs 13 having this error. Is there any alternative for this?

Code:-

 const provider = new ethers.providers.Web3Provider(window.ethereum);

 const signer = provider.getSigner();

 console.log(signer);

Answer 1

You need to install npm i --save-dev @ethersproject/providers.

import { ExternalProvider } from "@ethersproject/providers";

useEffect(() => {
    async function load() {
      try {
        const provider = new ethers.providers.Web3Provider(
          window.ethereum as unknown as ExternalProvider
        );
       // you get variables
       // then setstate inside useState
      }
      

proof of work: