用 Yarn Workspaces 统一管理 Safe 多签钱包的 Web 与移动双端及共享包
Yarn Workspaces 统一依赖管理与开发规范;packages/store 共享 Redux 让双端共享状态逻辑
✓ 共享包复用双端代码✓ 依赖管理与规范统一 ✕ 双端需分别查阅文档配置
方案简介
Safe(前身为 Gnosis Safe)是一个面向 Ethereum 及其他 EVM 链的多签智能合约钱包,需要多个签名才能执行交易。本方案基于 safe-wallet-monorepo 仓库,展示如何用 Yarn Workspaces 将 Web 端(Next.js)与移动端(Expo/React Native)应用以及共享包(store、utils)放在同一仓库中统一管理。
这一组合解决了多平台钱包开发中的核心问题:双端共享业务逻辑与状态管理(packages/store 提供双端共享的 Redux store,packages/utils 提供共享工具与 TypeScript 类型),同时保持各自平台的独立性。适合需要同时维护 Web 与移动端、希望统一依赖版本与开发规范的前端团队。
亮点与能力
- 双端统一仓库:web 与 mobile 应用加共享包在同一 monorepo 中管理
- 共享状态层:packages/store 提供双端共用的 Redux store
- 共享工具与类型:packages/utils 提供共享 utilities 和 TypeScript 类型
- Web 端基于 Next.js,含 Storybook 组件开发与 Cypress E2E 测试
- 移动端基于 Expo/React Native,UI 使用 Tamagui 组件库,含 Maestro E2E 测试
- 支持 Storybook 组件文档化开发
- 提供统一的 lint、prettier、type-check 命令覆盖所有 workspace
组成与分工
- Yarn Workspaces:monorepo 统一结构,简化依赖管理并保证跨项目开发实践一致
- Next.js:apps/web 的 React 框架,承载 Web 钱包应用
- Expo / React Native:apps/mobile 移动应用框架,含 iOS/Android 设置
- Redux(packages/store):双端共享的 Redux store
- packages/utils:共享 utilities 与 TypeScript 类型
- Tamagui:移动端 UI 组件库
- config/:共享配置文件
前置要求
- Node.js:安装最新稳定版(从 https://nodejs.org/ 获取)
- Yarn:4.5.3 或更高版本,可通过 corepack 启用:
bash
corepack enable
然后运行以下命令安装所需版本的 yarn 并解析所有依赖:
bash
yarn
实施步骤
1. 克隆仓库
bash
git clone
cd monorepo
2. 安装依赖
bash
yarn install
3. 启动开发环境
Web 应用开发模式:
bash
yarn workspace @safe-global/web dev
移动应用开发模式:
bash
yarn workspace @safe-global/mobile start
4. (可选)添加新 workspace
- 在
apps/或packages/下创建新目录。 - 添加带相应配置的
package.文件。 - 运行
yarn install。
使用与配置要点
常用命令
- 运行某个 workspace 的脚本:
bash
yarn workspace
方案出处
safe-global/safe-wallet-monorepo:Safe{Wallet} – smart account wallet 589 star Safe{Wallet} – smart account wallet
本方案由真实开源项目挖掘整理,实施命令均来自其 README 原文,安装使用请遵循项目开源协议。