Complete guide for building beautiful apps with Expo Router. Covers fundamentals, styling, components, navigation, animations, patterns, and native tabs.
中文简介正在准备中。当前显示原文说明。
Melvynx/saveit.now322026年10月19日 更新
免费在 GitHub 公开
expo-ui
Build native UI with the @expo/ui package: real SwiftUI on iOS and Jetpack Compose on Android rendered from React in an Expo or React Native app. Covers universal cross-platform components (Host, Column, Row, Button, Text, List, and more imported from @expo/ui), drop-in replacements for popular React Native community libraries (BottomSheet, DateTimePicker, Slider, Menu, etc.), and platform-specific SwiftUI (@expo/ui/swift-ui, iOS only) and Jetpack Compose (@expo/ui/jetpack-compose, Android only) trees and modifiers. Use when adding or reviewing @expo/ui Host/RNHostView trees, building native-feeling UI where standard React Native components fall short (grouped settings forms with toggles, sections, menus, sheets, pickers, sliders), choosing between universal and platform-specific components, or replacing an RN community UI library with a native @expo/ui equivalent. Not for custom native modules, Expo Router navigation, Reanimated, or data fetching.
中文简介正在准备中。当前显示原文说明。
查看安装方法包含的文件（7）
- SKILL.md4.3 KB
- agents/openai.yaml722 B
- references/drop-in-replacements.md2.0 KB
- references/jetpack-compose.md5.4 KB
- references/swift-ui.md4.3 KB
- references/universal.md3.4 KB
- scripts/list-components.js7.2 KB
SKILL.md（原文）
安装前可以查看交给 AI 代理的指令内容。
Expo UI (@expo/ui)
@expo/ui renders real native UI from React: SwiftUI on iOS, Jetpack Compose on Android. Start with its universal components (one tree for iOS, Android, and web) and drop to platform-specific SwiftUI/Jetpack Compose only when the universal layer falls short. It also ships drop-in replacements for migrating off RN community UI libraries.
These instructions track the latest Expo SDK. The universal layer requires SDK 56+. Drop-in replacements and the platform-specific layers also exist on SDK 55. For component details on a specific SDK, refer to the Expo UI docs for that version.
Installation
npx expo install @expo/ui
On SDK 56, @expo/ui works in Expo Go, so npx expo start runs it directly — no custom build required. On older SDKs, build a dev client first (npx expo run:ios / npx expo run:android).
Every @expo/ui tree — universal or platform-specific — must be wrapped in Host.
Choosing an approach (read this first)
Work down this list and stop at the first layer that meets the need:
-
Universal components — start here. Import from the
@expo/uiroot. One component tree runs unmodified on iOS, Android, and web from a single source (Compose on Android, SwiftUI on iOS,react-native-web/react-domon web). No platform file splits. →./references/universal.md -
Platform-specific (SwiftUI / Jetpack Compose). Import from
@expo/ui/swift-uior@expo/ui/jetpack-compose. Use only when the universal layer is missing a component or modifier you need, or when you need platform-specific behavior or optimization. Downside: you write two trees and split them into.ios.tsx/.android.tsxfiles (or branch onPlatform.OS) — more code to maintain.@expo/ui/swift-uiis iOS-only.@expo/ui/jetpack-composeis Android-only. Importing either in a file that runs on the other platform will crash at runtime with "Unable to get view config" errors. Isolate platform-specific trees in.ios.tsx/.android.tsxfiles placed incomponents/(never insideapp/— Expo Router does not support platform extensions for route files), or guard withPlatform.OSin a regular route file.Hostmust always be imported from@expo/ui(the universal package root), not from the platform-specific sub-packages. →./references/swift-ui.mdand./references/jetpack-compose.md
Already using an RN community UI library? @expo/ui also ships drop-in replacements — API-compatible swaps for popular libraries (@gorhom/bottom-sheet, @react-native-community/datetimepicker, and more), imported from @expo/ui/community/<name>. This is a migration side-path for replacing an existing dependency, not a step in the universal-vs-platform decision above. → ./references/drop-in-replacements.md
References
Consult these resources as needed:
references/
universal.md Universal @expo/ui components and when to use them (SDK 56+)
drop-in-replacements.md API-compatible replacements for RN community UI libraries
swift-ui.md Platform-specific iOS UI: @expo/ui/swift-ui components, modifiers, RNHostView, useNativeState
jetpack-compose.md Platform-specific Android UI: @expo/ui/jetpack-compose components, modifiers, LazyColumn caveat, icons, useNativeState
评价
还没有评价。欢迎分享你的使用感受。
评论
无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
同一仓库的技能
convex
免费Routes general Convex requests to the right project skill. Use when the user asks which Convex skill to use or gives an underspecified Convex app task.
中文简介正在准备中。当前显示原文说明。
Melvynx/saveit.now322026年10月19日 更新
Use when optimizing Convex database read bandwidth, documents-read cost, query indexes, full-table scans, function-level usage dashboard findings, or code that uses .filter(), unbounded .collect(), N+1 reads, or expensive reactive Convex queries.
中文简介正在准备中。当前显示原文说明。
Melvynx/saveit.now322026年10月19日 更新
Build reusable Convex components with isolated tables and app-facing wrappers. Use for defineComponent, app.use, ComponentApi, or shared backend modules.
中文简介正在准备中。当前显示原文说明。
Melvynx/saveit.now322026年10月19日 更新
Plan safe Convex schema and data migrations. Use for widen-migrate-narrow rollouts, backfills, breaking field changes, table splits, or failed schema deploys.
中文简介正在准备中。当前显示原文说明。
Melvynx/saveit.now322026年10月19日 更新
Audit Convex performance for hot reads, write contention, subscriptions, function limits, OCC conflicts, latency, read amplification, and expensive reactive queries.
中文简介正在准备中。当前显示原文说明。
Melvynx/saveit.now322026年10月19日 更新