请解释 wagmi 与 RainbowKit 这两个库各自的定位，并说明它们在 Web3 前端开发中分别解决了哪些实际问题？

回答思路

1. 【回答框架 1】wagmi 是一组用于 React 的 Hooks 库，封装了连接钱包、读取链上数据、发送交易、监听事件等常见操作，通过声明式 API 简化了与以太坊区块链的交互。
2. 【回答框架 2】RainbowKit 是基于 wagmi 构建的 React 组件库，提供即插即用的连接钱包按钮、模态框和账户展示界面，开发者无需从零编写 UI 即可快速实现钱包连接流程。
3. 【回答框架 3】wagmi 解决的核心问题是底层协议对接的复杂性和状态管理的重复性，例如处理 provider、signer、链切换、交易状态等；RainbowKit 则解决钱包连接体验的统一性和开发效率问题。
4. 【回答框架 4】二者形成互补：wagmi 作为底层数据层，RainbowKit 作为上层 UI 层，常搭配使用，但 RainbowKit 依赖 wagmi，而 wagmi 可独立用于自定义界面。
5. 【回答框架 5】实际选型时，若要求高度定制 UI，可只用 wagmi；若追求快速原型或统一体验，则可组合使用。两者均针对 Ethers.js 的繁琐调用做了抽象，提升了开发效率和代码可维护性。
6. 【关键点 1】wagmi 是 React Hooks 库，提供连接、交易、链状态等封装，简化以太坊交互。
7. 【关键点 2】RainbowKit 是钱包连接 UI 组件库，依赖 wagmi，提供开箱即用的连接体验。
8. 【关键点 3】wagmi 解决底层交互和状态管理，RainbowKit 解决 UI 和用户体验。
9. 【关键点 4】两者可独立或组合使用，组合时 RainbowKit 作为 wagmi 的上层包装。
10. 【易错点 1】不要混淆二者定位：wagmi 不是 UI 库，RainbowKit 不是数据层。
11. 【易错点 2】RainbowKit 必须依赖 wagmi，不能单独使用，且其内部实现依赖于特定版本。
12. 【易错点 3】使用 wagmi 时需注意版本更新较大，API 在不同版本间有变化，需按项目锁定版本。