a working example of web3modal with typescript 5

Question

I wanted to play around with web3modal (walletconnect) in typescript.

I followed the official guide, but was unable to finish my setup due to dependency problems

to reproduce simply run the following:

1. npx create-react-app web3modal --template typescript
2. cd web3modal
3. npm install @web3modal/ethereum @web3modal/react wagmi viem
   initial problem screenshot

so I tried to solve it:

4. npm i typescript@^5 (which results in warning shown below)
   warnings screenshot

5. npm install @web3modal/ethereum @web3modal/react wagmi viem
   which results in more errors now, screenshot truncated more errors screenshot

I tried searching for a version of web3modal that uses typescript ^4, but after going down to 2.3.0 - it still sits at 5.0.4.

so my question is:
is there any react/typescript example that uses up to date versions of web3modal? and if not - what are the versions of web3modal/wagmi/viem that I can downgrade to to still use typescript 4.9.5?

edit: I'm aware that this exists, but it's missing the typescript part

Answer 1

This is related to wagmi dep https://wagmi.sh/react/typescript

you'll need to run npm i --legacy-peer-deps

and for compile issues:

Try adding "skipLibCheck": true in the tsconfig.json file.