react本地博览会mcp
MCP服务器，用于使用Claude Code进行React Native+Expo开发。
为Claude提供了有关Expo Router、NativeWind、Zustand+MMKV、Axios、TanStack Query、EAS Build、性能优化和TypeScript模式的深入知识，因此它在您编码时会自动调用正确的工具。
有两种方法可以使用它
选项A-MCP服务器（推荐）
Claude在开发过程中自动调用这些工具。无需复制粘贴。
git clone https://github.com/zahargusyatin/react-native-expo-mcp.git
cd react-native-expo-mcp
npm install && npm run build
claude mcp add --global react-native-expo -- node /path/to/react-native-expo-mcp/dist/index.js连接后，当您要求Claude创建组件、屏幕、商店、API挂钩等时，Claude会自动调用正确的工具。
选项B——直接读取源文档
如果你不想运行MCP服务器，源材料在 docs/。这些是MCP内容所基于的原始参考文档——您可以将它们粘贴到任何AI聊天中或自己阅读。
| 文件 | 内容 |
|---|---|
docs/best-practices.md | 架构、逻辑/UI分离、组件、状态、API、样式、导航 |
docs/setup-tutorial.md | 逐步项目设置（工具→ EAS → CI/CD） |
docs/callstack-optimization.md | 性能深度挖掘：列表、内存、并发React、Reanimated、捆绑包分析 |
______________________________________________________________________
工具（共13个）
模式工具——Claude在编码时自动调用这些工具
| 工具 | 何时调用。.. |
|---|---|
get-component-patterns | 创建组件、按钮、卡、列表项 |
get-screen-architecture | 创建新屏幕或路线 |
get-navigation-patterns | 使用路由、深度链接、身份验证保护 |
get-state-patterns | 创建Zustand商店或与全球政府合作 |
get-api-patterns | 创建API服务或数据获取挂钩 |
get-styling-patterns | 使用NativeWind设计组件 |
get-performance-patterns | 优化列表、图像、捆绑包、动画 |
get-project-structure | 决定在何处放置新文件 |
get-typescript-patterns | 书写类型或接口 |
get-memory-optimization | 调试内存泄漏或性能问题 |
设置工具——创建项目时使用一次
| 工具 | 目的 |
|---|---|
setup-new-project | 从头开始创建新世博项目的分步指南 |
generate-project-files | 生成启动文件（布局、存储、API客户端、屏幕、配置） |
generate-claude-md | 生成 CLAUDE.md 包含项目规则和MCP工具使用说明 |
提示
init-mobile-project --交互式向导，询问您的项目并调用正确的工具。
______________________________________________________________________
自动工具调用的工作原理
添加时 generate-claude-md 输出到您的项目 CLAUDE.md，克劳德知道自动调用工具：
You: "Create a product card component"
Claude: calls get-component-patterns → reads Pressable, expo-image, React.memo patterns → writes correct code
You: "Add a catalog screen"
Claude: calls get-screen-architecture → reads Logic/UI separation rules → creates Route + ScreenUI files
You: "The list is laggy"
Claude: calls get-performance-patterns → reads LegendList, FlashList, getItemLayout → optimizes______________________________________________________________________
技术栈已覆盖
- 博览会 （管理工作流）+ 世博路由器 （基于文件的路由）
- TypeScript 严格模式+路径别名
- NativeWind v4 （React Native的顺风CSS）
- 状态 + MMKV （状态+持久性）
- 阿西奥斯 + TanStack查询v5 （API+服务器状态）
- EAS构建 + OTA更新 + GitHub操作
- 反应本土复活, 世博会形象, 传奇/闪光名单
- React编译器（React 19+）、并发React、内存分析
许可证
麻省理工学院