Moralis JS SDK v1.0 (migration to Ethers.js)

Will Moralis now work with Webpack5?

I know that web3.js was giving problems. But I’m not sure if that was the only dependency giving issues. Every dependency that is using NodeJs functionalities needs to be poly-filled (see the discussion on create-react-app https://github.com/facebook/create-react-app/issues/11756).
It wouldn’t surprise me that it still is not working, we will make a boilerplate that is compatible with v5 soon though.

1 Like

As suggested, Moralis.onChainChanged() and Moralis.onAccountChanged() no longer work. What should we be using in their place to detect when Metamask changes chaing or account?

2 Likes

How could I get the getSigner in react-moralis v1? is it something like below?

const { provider } = useMoralis()

const signer = provider.getSigner() // compile error in TS

I’ve checked the provider it’s the unknown type which is not friendly in TypeScript.

That should still work @Erno will check

They should still be working and not removed, the only thing that change is this one

I had changed the onAccountsChanged to onAccountChanged which stopped errors but none of the events were activating. I’ll play around and see if I can see what’s going on.

I see @Erno can probably take a look on this if there is really an issue on this :raised_hands:

The events are now fired differently. Before it was firing the Metamask onChain/onAccountsChanged events. Now it is firing the onChain/onAccountsChanged of the method that is used for authentication/enableWeb3.

So before you call authenticate/enableWeb3, no events will be fired. Then if you authenticate via Walletconnect, you will get events from WalletConnect.

I assume you use the events before enableWeb3/authenticate was called?

If so, then if you want to listen for Metamask events, you can use window.ethereum.on:

    window.ethereum.on("accountsChanged", (account) =>
      console.log("account")
    );
    window.ethereum.on("chainChanged", (chain) =>
      console.log("chain")
    );

Correct, the provider can be any EIP1193 provider that is returned from Metamask/WalletConnect/etc., so that’s why we have it typed as unknown right now.

To get the signer, you need to use the instance of the Ethers web3. You can use something like:

  const { web3 } = useMoralis();

  useEffect(() => {
    if (web3) {
      const signer = (web3 as any).getSigner();
      console.log("signer", signer);
    }
  }, [web3]);

Just noticed that we have no proper types for the returned web3, will look into that one to provide better types.

1 Like

My Dapp was working fine ; but now I get prompted with the following error ‘TypeError: Moralis.Web3.onAccountsChanged is not a function’. I updated npm install moralis@latest and also npm install moralis@latest. I believe this error is coming internally as I did not use Moralis.Web3.onAccountsChanged function on my Dapp or scripts.

1 Like

Will Moralis.Web3API remain available in the cloud functions after updating the server?

What version of react-moralis do you use?
If you upgraded moralis to v1.0 then you should also update react-moralis to v1.0

@Erno
Those are my dependencies

"dependencies": {

    "@walletconnect/web3-provider": "^1.7.1",

    "axios": "^0.24.0",

    "install": "^0.13.0",

    "moralis": "^1.0.1",

    "next": "^12.0.8",

    "react": "^17.0.2",

    "react-dom": "^17.0.2",

    "react-moralis": "^0.3.11",

    "timeago-react": "^3.0.4"

  },

So you need to update react-moralis as well to v1.0

@Erno could you please give me the commands on how to do so
. Thanks

Try npm install react-moralis@latest

Thanks @Erno :muscle:

1 Like

yes, the server is not affected by this update

1 Like

Thank you very much !!! I confirm : i solved my current problem by reading this post.
I let my development project 2 days ago, working perfectly, and today when i relaunched everything i discovered tons of error in my browser console. I really started to be desperated (ahahah). But fortuntely, i have seen the youtube recent video on “Nitro” and then saw this post.
EVERYTHING WORKS BACK AGAIN !!! Champaaaagne !

1 Like