在 Tamagui/Turbo/Next.js/Expo/S…

当使用 Tamagui、Turbo、Next.js、Expo、Supabase、Solito、Stripe 构建 TypeScript 跨平台 monorepo 应用时，按统一规范组织代码、样式、状态、性能、导航与支付集成。

适用场景

解决思路

1. 编写简洁的 TypeScript，优先使用函数式模式
2. 使用带辅助动词的描述性变量名，例如 isLoading
3. 使用命名导出组织文件，导出组件、辅助函数和类型
4. 优先使用 interface 而不是 type
5. 使用 Zod 进行 schema 校验
6. 使用字面量类型而不是 enum
7. 使用 TypeScript interface 定义 props 构建函数式组件
8. 使用 Tamagui 构建跨平台组件
9. 实现移动优先的响应式设计
10. 在 Web 与原生端保持样式一致
11. 使用 Tamagui 的主题能力
12. 使用 Zustand 管理状态
13. 使用 TanStack React Query 进行数据获取与缓存
14. 尽量减少 useEffect 的使用
15. 在 Web 端使用 i18next 和 react-i18next
16. 在 React Native 端使用 expo-localization
17. 国际化所有面向用户的文本
18. 优先考虑边缘情况
19. 使用 guard clauses 提前处理错误
20. 实现自定义错误类型以保持一致
21. 同时优化 Web 和原生平台
22. 在 Next.js 中使用动态导入
23. 实现懒加载
24. 使用合适格式优化图片
25. 遵循 Turbo 最佳实践
26. 通过正确的依赖管理隔离包
27. 使用共享配置
28. 按 package.json 组织 workspace
29. 使用 Solito 进行导航
30. 为平台特定代码创建 .native.tsx 文件
31. 使用 SolitoImage 实现跨平台图片兼容
32. 实现支付处理和订阅
33. 使用 Stripe Customer Portal
34. 处理 webhook 以接收订阅事件
35. 将订阅状态与 Supabase 同步

适用边界 · 注意事项

• 不适用于非 monorepo、单端 Web 或单端 React Native 项目
• 不适用于未使用 Tamagui、Turbo、Next.js、Expo、Supabase、Solito、Stripe 技术栈的项目
• 不适用于无需跨平台、国际化、订阅支付或云端同步的轻量项目