1. EIP6963#
Problem Introduction#
When connecting to certain websites, we may click on "Metamask Login" but a login prompt for OKX Wallet or other wallets appears instead. This is because the current website is using the old EIP-1193 to interact with the global window.ethereum
object. In reality, different browser wallet plugins may have a loading order issue, where the last loaded wallet hijacks the window.ethereum
object.
Solution:#
In May 2023, the EIP-6963 solution was introduced to address this issue. With EIP-6963, it is possible to obtain an independent EIP1193Provider for each wallet. This avoids interference between wallets.
So how do we integrate it?
- Use WAGMI 2.x, which natively supports EIP-6963. I checked the wallet login on the xlog platform and it also uses wagmi, but when logging in with Metamask, it is still intercepted by OKX. After looking at the code, it seems to be using wagmi 1.x, which probably doesn't support EIP6963.
- Use the mipd library to obtain the corresponding wallet's EIP1193Provider. Then use ethers for integration.
After window.ethereum
is hijacked, some wallets, like OKX Wallet, still provide users with an option to choose Metamask. However, most wallets simply replace it without giving users a choice. For users, when they click on Metamask Login, a prompt for another wallet appears. This is a confusing user experience and can be considered a bug. It is recommended to upgrade.
Related Resources#
- How to Implement EIP-6963 Support in Your Web 3 Dapp
- MetaMask Vite React TypeScript EIP-6963 Example
2. Typescript Version#
Problem Introduction#
When opening a new project, it is often encountered that even though the dependencies are already installed, there are still TypeScript errors. There are generally two possible reasons for this: one is that TypeScript hasn't caught up yet, and simply reloading the project can solve it. The other is that the TypeScript version is incorrect, and it defaults to using the version of vscode. Switching it can solve the issue. Is it possible to avoid this situation through configuration?
Solution#
- vscode has a confusing configuration called "typescript.tsdk", which does not take effect when opening for the first time. However, it will take effect on subsequent loads.
- vscode also has a configuration called "typescript.enablePromptUseWorkspaceTsdk", which can be set to true. This way, every time you open a project, there will be a prompt in the bottom right corner asking you to switch to the workspace's TypeScript version. If you don't switch, it will pop up every time you open the project.
In fact, this does not fundamentally solve the problem. Since vscode already has the functionality to trust the workspace, why can't it automatically load the TypeScript version of the project files? Looking forward to better solutions.