Module not found: Can't resolve '@walletconnect/legacy-client’

Reason

If you have recently attempted migrating from WCv1 to WCv2, you may have run into the following error:

Module not found: Can't resolve '@walletconnect/legacy-client'

This error means the dependencies need to be removed and reinstalled per the steps below.

Full error for reference:

Module not found: Can't resolve '@walletconnect/legacy-client'
Import trace for requested module:
./node_modules/@thirdweb-dev/wallets/evm/connectors/wallet-connect-v1/dist/thirdweb-dev-wallets-evm-connectors-wallet-connect-v1.browser.esm.js
./node_modules/@thirdweb-dev/wallets/evm/wallets/metamask/dist/thirdweb-dev-wallets-evm-wallets-metamask.browser.esm.js
./node_modules/@thirdweb-dev/wallets/dist/thirdweb-dev-wallets.browser.esm.js
./node_modules/@thirdweb-dev/react/dist/thirdweb-dev-react.browser.esm.js
./pages/_app.tsx

Solution

To overcome this, please follow the steps below:

1. Remove node_modules. If you are using vite - delete the node_modules/.vite folder, if you are using next.js - delete the .next folder

2. If you have added @thirdweb-dev/react as a dependency in package.json, you don't need to add @thirdweb-dev/wallets.

3. If you have @thirdweb-dev/wallets installed, remove it from package.json. There is no need to have both @thirdweb-dev/react and @thirdweb-dev/wallets in package.json dependency. Just have @thirdweb-dev/react

4. Run yarn install to update your dependencies.

After following these steps, dependencies should be properly installed and the error message resolved.

If you are still running into an error after following these steps, please create a new post in our Discord #support channel.