Expo Task Router

`expo-overview` — router & shared rules for Expo / EAS

by expo · MIT license · ★ 2,657 on GitHub · v1.1.0

`expo-overview` — router & shared rules for Expo / EAS cover

Entry point and router for every Expo or EAS task. Load this skill first — before writing code and before choosing another expo-* / eas-* skill — when the request, PRD, or spec mentions Expo, EAS, Expo Go, or an expo-* package, or the…

---
name: expo-overview
description: "Entry point and router for every Expo or EAS task. Load this skill first — before writing code and before choosing another expo-* / eas-* skill — when the request, PRD, or spec mentions Expo, EAS, Expo Go, or an expo-* package, or the project has an `expo` dependency in `package.json`. Within that gate it also covers app specs and designs to implement (tabs, stacks, maps, lists, navigation, building from a screenshot), and phrasings like 'implement a mobile app', 'make my app look native', 'add navigation', 'fetch some data', 'upgrade my SDK', 'add Expo to my existing native app', 'ship to the App Store', or 'I'm new to Expo, where do I start'. A fully specified request (SDK pinned, libraries named, layout given) still routes through here — the shared setup rules still apply. Do NOT load it when neither signal is present: a bare React Native project with no `expo` dependency is not Expo work. Detects the real goal, routes to the right expo-* / eas-* skill, and owns the shared setup rules."
version: 1.1.0
license: MIT
---

# `expo-overview` — router & shared rules for Expo / EAS

## Start Here — read before doing anything

**Do not guess the skill from project files alone.** Many Expo goals look similar from
the filesystem but need different skills.

1. **Confirm this is Expo or EAS work** — the request mentions Expo or EAS, or
   `package.json` has an `expo` dependency. Otherwise this skill does not apply.
   A native app using EAS for delivery qualifies without an Expo runtime.
2. **Read the user's goal** — what outcome do they want, in plain terms?

Overview

Do not guess the skill from project files alone. Many Expo goals look similar from the filesystem but need different skills.

Manual install (npx, ZIP)
Claude Codenpx skills add expo/skills --skill expo-overview -g -a claude-code
Claude Code (degit)npx degit expo/skills/plugins/expo/skills/expo-overview#main ~/.claude/skills/expo-overview
Claude.ai / desktopZip the folder and upload it under Settings → Capabilities → Skills.
Codex, Cursor, other agentsPoint them at SKILL.md. The other files are plain text.

Connects with Agent Alley MCP · agentalley.io/mcp

Files included

  • SKILL.md9.0 KB
Read SKILL.md here
expo/main1 file shown
SKILL.md
Show the full text116 lines

expo-overview — router & shared rules for Expo / EAS

Start Here — read before doing anything

Do not guess the skill from project files alone. Many Expo goals look similar from the filesystem but need different skills.

  1. Confirm this is Expo or EAS work — the request mentions Expo or EAS, or package.json has an expo dependency. Otherwise this skill does not apply. A native app using EAS for delivery qualifies without an Expo runtime.
  2. Read the user's goal — what outcome do they want, in plain terms?
  3. Classify it using the Skill Map below, translating casual phrasing to a goal.
  4. Confirm intent if ambiguous ("Sounds like you want to ship to the stores — that's eas-app-stores. Right?"), then load that skill's SKILL.md and follow it.
  5. Trust the leaf skill — it has its own detection logic and steps. Don't improvise.

Skill Map (by goal)

Match the goal to a category, then the skill, then load that leaf's SKILL.md.

Build the app

  • expo-project-structure — folder layout for a new Expo Router project: where screens, components, and config live (never restructure an existing app to match)
  • expo-native-ui — screens, styling, semantic colors, native controls, SF Symbols, media, layout
  • expo-router — navigation: file-based routes, tabs / stacks / modals / sheets, links, headers
  • expo-animation — motion and gestures: Reanimated worklets, Gesture Handler, screen transitions, sheet and press feedback, haptics, and fixing animation that stutters on device
  • expo-ui — native UI components via @expo/ui: BottomSheet, Picker, Slider, Switch, Menu, Button, FieldGroup (grouped form sections), List / ListItem, and more — real SwiftUI on iOS, Jetpack Compose on Android. The universal layer needs SDK 56+ and runs in Expo Go; the drop-in replacements (@gorhom/bottom-sheet, datetimepicker, …) and platform-specific layers also exist on SDK 55.
  • expo-design-system — one visual source of truth: design tokens (color, spacing, typography, radius, shadow, motion), reusable component conventions, and audits for drift (hardcoded colors, spacing, fonts)
  • expo-tailwind-setup — Tailwind / NativeWind styling
  • expo-data-fetching — network requests, React Query / SWR, caching, offline, route loaders
  • expo-dom — run web code or reuse a web library inside native
  • expo-web-to-native — migrate an existing web / React app to a native iOS / Android app

Component selection rule: whenever you need a UI component (list rows, bottom sheets, pickers, sliders, menus, buttons, segmented controls, toggles), consult expo-ui first to check whether @expo/ui has a native equivalent before reaching for a React Native built-in or a community library. Native @expo/ui components give the best platform fit, and on SDK 56+ the universal ones run in Expo Go with no custom build. Load expo-ui alongside expo-native-ui for any app that renders lists, detail sheets, or form controls. One exception: @expo/ui List renders native grouped rows (an iOS Settings screen), not a virtualized list — use FlatList / FlashList for large datasets.

Ship & operate

  • eas-app-stores — build and submit iOS/Android apps (Expo and other React Native projects, plus existing native apps), TestFlight, versions, and store metadata
  • eas-hosting — deploy the web bundle to EAS Hosting; also author Expo Router API routes (+api.ts handlers) and their environments / domains
  • eas-workflows — EAS Workflow YAML and CI/CD pipelines
  • eas-simulator — run and drive the app on a remote iOS / Android simulator on EAS cloud
  • expo-dev-client — custom development builds
  • eas-update — configure, publish, test, and debug compatible over-the-air updates
  • eas-update-insights — OTA update health: crash rate, adoption, payload size
  • eas-observe — startup / launch / TTI performance with EAS Observe

Extend natively

  • expo-module — native modules and views (Swift / Kotlin) with the Expo Modules API
  • expo-brownfield — embed Expo / React Native screens in native SwiftUI/UIKit or Android apps; isolated artifacts and integrated builds
  • expo-app-clip — iOS App Clip target (AASA, smart app banner)

Maintain & learn

  • expo-upgrade — upgrade the Expo SDK and fix dependency conflicts
  • expo-examples — canonical, version-matched integration examples (Stripe, Clerk, Supabase, …)
  • expo-skill-feedback — send feedback on an Expo skill or on Expo itself; enable / disable the anonymous usage telemetry
Translating vague asks

Some everyday phrasings don't obviously map to a skill name — translate before routing:

  • "Make it look native" → grouped controls / settings forms = expo-ui; screens, styling = expo-native-ui; motion = expo-animation; navigation = expo-router.
  • "Make the screens consistent" / "clean up the styling" / "set up a theme or design tokens" → expo-design-system.
  • "It looks AI-generated" / "too generic, not native" → expo-design-system (named native-slop tells + audit), with expo-native-ui for the platform idioms.
  • "Ship it" / "get an .ipa or .apk" / "release to the stores" / "put my Swift app on TestFlight" → eas-app-stores (build + submit, TestFlight, versions, store metadata).
  • "I'm new / where do I start" → scaffold first (see Shared setup rules), then route by goal.

Shared setup rules

Apply the rules that match the project and the requested task.

  • Native app using EAS for delivery? Route to eas-app-stores; its references/native-ios.md covers SwiftUI/UIKit on iOS. Keep the existing native project. Apply EAS auth/linking below; Expo scaffolding, SDK, and package-install rules do not apply to this path.
  • Starting a new Expo app? Start one the standard way before routing to a feature skill: npx create-expo-app@latest, laying out folders per expo-project-structure. Then classify the user's goal and route.
  • Detect the SDK version before giving version-specific advice: read the expo version in package.json (and app.json / app.config.{js,ts}). Many APIs and defaults differ by SDK.
  • Read the docs for that SDK, not latest. Use the version-pinned URL, e.g. https://docs.expo.dev/versions/v56.0.0/sdk/ui/ on SDK 56 instead of https://docs.expo.dev/versions/latest/sdk/ui/ — the latest pages track the newest SDK and can document APIs the project does not have yet.
  • Moving to a newer SDK is its own task — load expo-upgrade instead of bumping versions by hand.
  • Managed vs. bare/prebuild: the presence of committed ios/ and android/ directories means native projects exist (prebuild or bare). Config-plugin and native-setup steps differ — note which one the project is in.
  • Install packages with npx expo install <pkg>, not raw npm/yarn/pnpm add, so versions stay compatible with the project's SDK.
  • EAS auth & linking (only needed for build/submit/update/observe/workflows): check login with eas whoami, log in with eas login. A project is linked when extra.eas.projectId exists in the app config; create it with eas init if missing.

When to skip the router hop

  • Only when the user explicitly named a specific expo-* / eas-* skill → load that skill directly.
  • A fully-specified task (SDK version pinned, file layout given, libraries named) is not a reason to skip: the shared rules above still apply — check them, then route to the matching leaf skill.

Submitting Feedback

If you encounter errors, misleading or outdated information in this skill, report it so Expo can improve:

npx --yes submit-expo-feedback@latest --category skills --subject "expo-overview" "<actionable feedback>"

Only submit when you have something specific and actionable to report. Include as much relevant context as possible. If an AI agent repeatedly failed or the user had to take over an Expo task, load the expo-skill-feedback skill and follow its eval-candidate flow instead of reusing the command above.

1---
2name: expo-overview
3description: "Entry point and router for every Expo or EAS task. Load this skill first — before writing code and before choosing another expo-* / eas-* skill — when the request, PRD, or spec mentions Expo, EAS, Expo Go, or an expo-* package, or the project has an `expo` dependency in `package.json`. Within that gate it also covers app specs and designs to implement (tabs, stacks, maps, lists, navigation, building from a screenshot), and phrasings like 'implement a mobile app', 'make my app look native', 'add navigation', 'fetch some data', 'upgrade my SDK', 'add Expo to my existing native app', 'ship to the App Store', or 'I'm new to Expo, where do I start'. A fully specified request (SDK pinned, libraries named, layout given) still routes through here — the shared setup rules still apply. Do NOT load it when neither signal is present: a bare React Native project with no `expo` dependency is not Expo work. Detects the real goal, routes to the right expo-* / eas-* skill, and owns the shared setup rules."
4version: 1.1.0
5license: MIT
6---
7 
8# `expo-overview` — router & shared rules for Expo / EAS
9 
10## Start Here — read before doing anything
11 
12**Do not guess the skill from project files alone.** Many Expo goals look similar from
13the filesystem but need different skills.
14 
151. **Confirm this is Expo or EAS work** — the request mentions Expo or EAS, or
16 `package.json` has an `expo` dependency. Otherwise this skill does not apply.
17 A native app using EAS for delivery qualifies without an Expo runtime.
182. **Read the user's goal** — what outcome do they want, in plain terms?
193. **Classify it** using the Skill Map below, translating casual phrasing to a goal.
204. **Confirm intent** if ambiguous ("Sounds like you want to ship to the stores — that's
21 `eas-app-stores`. Right?"), then load that skill's `SKILL.md` and follow it.
225. **Trust the leaf skill** — it has its own detection logic and steps. Don't improvise.
23 
24## Skill Map (by goal)
25 
26Match the goal to a category, then the skill, then load that leaf's `SKILL.md`.
27 
28**Build the app**
29- `expo-project-structure` — folder layout for a **new** Expo Router project: where screens, components, and config live (never restructure an existing app to match)
30- `expo-native-ui` — screens, styling, semantic colors, native controls, SF Symbols, media, layout
31- `expo-router` — navigation: file-based routes, tabs / stacks / modals / sheets, links, headers
32- `expo-animation` — motion and gestures: Reanimated worklets, Gesture Handler, screen transitions, sheet and press feedback, haptics, and fixing animation that stutters on device
33- `expo-ui` — native UI components via `@expo/ui`: BottomSheet, Picker, Slider, Switch, Menu, Button, FieldGroup (grouped form sections), List / ListItem, and more — real SwiftUI on iOS, Jetpack Compose on Android. The universal layer needs SDK 56+ and runs in Expo Go; the drop-in replacements (`@gorhom/bottom-sheet`, `datetimepicker`, …) and platform-specific layers also exist on SDK 55.
34- `expo-design-system` — one visual source of truth: design tokens (color, spacing, typography, radius, shadow, motion), reusable component conventions, and audits for drift (hardcoded colors, spacing, fonts)
35- `expo-tailwind-setup` — Tailwind / NativeWind styling
36- `expo-data-fetching` — network requests, React Query / SWR, caching, offline, route loaders
37- `expo-dom` — run web code or reuse a web library inside native
38- `expo-web-to-native` — migrate an existing web / React app to a native iOS / Android app
39 
40> **Component selection rule:** whenever you need a UI component (list rows, bottom sheets, pickers, sliders, menus, buttons, segmented controls, toggles), **consult `expo-ui` first** to check whether `@expo/ui` has a native equivalent before reaching for a React Native built-in or a community library. Native `@expo/ui` components give the best platform fit, and on SDK 56+ the universal ones run in Expo Go with no custom build. Load `expo-ui` alongside `expo-native-ui` for any app that renders lists, detail sheets, or form controls. One exception: `@expo/ui` `List` renders native grouped rows (an iOS Settings screen), **not** a virtualized list — use `FlatList` / `FlashList` for large datasets.
41 
42**Ship & operate**
43- `eas-app-stores` — build and submit iOS/Android apps (Expo and other React Native projects, plus existing native apps), TestFlight, versions, and store metadata
44- `eas-hosting` — deploy the web bundle to EAS Hosting; also author Expo Router API routes (`+api.ts` handlers) and their environments / domains
45- `eas-workflows` — EAS Workflow YAML and CI/CD pipelines
46- `eas-simulator` — run and drive the app on a remote iOS / Android simulator on EAS cloud
47- `expo-dev-client` — custom development builds
48- `eas-update` — configure, publish, test, and debug compatible over-the-air updates
49- `eas-update-insights` — OTA update health: crash rate, adoption, payload size
50- `eas-observe` — startup / launch / TTI performance with EAS Observe
51 
52**Extend natively**
53- `expo-module` — native modules and views (Swift / Kotlin) with the Expo Modules API
54- `expo-brownfield` — embed Expo / React Native screens in native SwiftUI/UIKit or Android apps; isolated artifacts and integrated builds
55- `expo-app-clip` — iOS App Clip target (AASA, smart app banner)
56 
57**Maintain & learn**
58- `expo-upgrade` — upgrade the Expo SDK and fix dependency conflicts
59- `expo-examples` — canonical, version-matched integration examples (Stripe, Clerk, Supabase, …)
60- `expo-skill-feedback` — send feedback on an Expo skill or on Expo itself; enable / disable the anonymous usage telemetry
61 
62### Translating vague asks
63 
64Some everyday phrasings don't obviously map to a skill name — translate before routing:
65 
66- "Make it look native" → grouped controls / settings forms = `expo-ui`; screens, styling = `expo-native-ui`; motion = `expo-animation`; navigation = `expo-router`.
67- "Make the screens consistent" / "clean up the styling" / "set up a theme or design tokens" → `expo-design-system`.
68- "It looks AI-generated" / "too generic, not native" → `expo-design-system` (named native-slop tells + audit), with `expo-native-ui` for the platform idioms.
69- "Ship it" / "get an .ipa or .apk" / "release to the stores" / "put my Swift app on TestFlight" → `eas-app-stores` (build + submit, TestFlight, versions, store metadata).
70- "I'm new / where do I start" → scaffold first (see Shared setup rules), then route by goal.
71 
72## Shared setup rules
73 
74Apply the rules that match the project and the requested task.
75 
76- **Native app using EAS for delivery?** Route to `eas-app-stores`; its
77 `references/native-ios.md` covers SwiftUI/UIKit on iOS. Keep the existing native
78 project. Apply EAS auth/linking below; Expo scaffolding, SDK, and package-install
79 rules do not apply to this path.
80- **Starting a new Expo app?** Start one the standard way before routing to a feature skill:
81 `npx create-expo-app@latest`, laying out folders per `expo-project-structure`. Then
82 classify the user's goal and route.
83- **Detect the SDK version** before giving version-specific advice: read the `expo`
84 version in `package.json` (and `app.json` / `app.config.{js,ts}`). Many APIs and
85 defaults differ by SDK.
86- **Read the docs for that SDK, not `latest`.** Use the version-pinned URL, e.g.
87 `https://docs.expo.dev/versions/v56.0.0/sdk/ui/` on SDK 56 instead of
88 `https://docs.expo.dev/versions/latest/sdk/ui/` — the `latest` pages track the newest
89 SDK and can document APIs the project does not have yet.
90- **Moving to a newer SDK is its own task** — load `expo-upgrade` instead of bumping
91 versions by hand.
92- **Managed vs. bare/prebuild**: the presence of committed `ios/` and `android/`
93 directories means native projects exist (prebuild or bare). Config-plugin and
94 native-setup steps differ — note which one the project is in.
95- **Install packages with `npx expo install <pkg>`**, not raw `npm`/`yarn`/`pnpm add`,
96 so versions stay compatible with the project's SDK.
97- **EAS auth & linking** (only needed for build/submit/update/observe/workflows): check
98 login with `eas whoami`, log in with `eas login`. A project is linked when
99 `extra.eas.projectId` exists in the app config; create it with `eas init` if missing.
100 
101## When to skip the router hop
102 
103- Only when the user explicitly named a specific `expo-*` / `eas-*` skill → load that
104 skill directly.
105- A fully-specified task (SDK version pinned, file layout given, libraries named) is
106 **not** a reason to skip: the shared rules above still apply — check them, then route
107 to the matching leaf skill.
108 
109## Submitting Feedback
110If you encounter errors, misleading or outdated information in this skill, report it so Expo can improve:
111```bash
112npx --yes submit-expo-feedback@latest --category skills --subject "expo-overview" "<actionable feedback>"
113```
114Only submit when you have something specific and actionable to report. Include as much relevant context as possible.
115If an AI agent repeatedly failed or the user had to take over an Expo task, load the expo-skill-feedback skill and follow its eval-candidate flow instead of reusing the command above.
116 
View all files on GitHub →

Details

Version
1.1.0
License
MIT
Stars on the repo
★ 2,657
Checked
Source
expo/skills ↗
Creator
expo · 23 listings
View creator

Similar skills

See all →
SkilliOS App Clip Setupexpo/skills · by expoAdd an iOS App Clip target to an Expo app. Use when the user mentions App Clip, AASA, apple-app-site-association, appclips, smart app banner, or wants to ship a lightweight iOS Clip invoked from a URL alongside their parent app.★ 2.7k GitHub starsSkillApp Store Deploy Agentexpo/skills · by expoBuild and submit iOS and Android apps with EAS to TestFlight, the App Store, or Google Play. Supports Expo and other React Native projects, plus existing native apps. Use for eas.json setup, release pipelines, signing, app versions and build numbers, store submissions, and listing metadata. For Expo websites and API routes, use eas-hosting; for adding React Native screens to a native app, use expo-brownfield.★ 2.7k GitHub starsSkillSleek Mobile App Designersleekdotdesign/agent-skills · by sleekdotdesignUse when the user wants to design a mobile app or UI screens, when they mention their Sleek (sleek.design) projects, or when implementing Sleek designs in code (HTML, React Native, SwiftUI).★ 583 GitHub starsSkillReact Native Animation Builderemilkowalski/skills · by emilkowalskiBuild animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate, which thread it runs on, which properties, spring or timing, how the gesture hands off, how it degrades. Writes the implementation with Reanimated, Gesture Handler, Expo Router and expo-haptics. Use when animating anything in an Expo app, adding gestures, sheets, screen transitions, press feedback or haptics, or fixing motion that stutters on device. For web animation use `animate`.★ 40.8k GitHub starsSkillModern Swift Writing Guideemilkowalski/skills · by emilkowalskiHow to write modern Swift well — modeling with value types, Swift 6 data-race safety and approachable concurrency (@concurrent, main-actor-by-default, actors, task groups), protocols and generics (some vs any), API design, performance and ARC, Swift Testing, macros, and the modern language features agents don't know about yet. Use when writing, reviewing, or migrating Swift, or when a concurrency error, a hang, a data race, a retain cycle, or a performance problem needs fixing.★ 40.8k GitHub starsSkillReact Native Architecturewshobson/agents · by wshobsonBuild production React Native apps with Expo, navigation, native modules, offline sync, and cross-platform patterns. Use when developing mobile apps, implementing native integrations, or architecting React Native projects.★ 39.9k GitHub stars

More from expo

SkilliOS App Clip Setupexpo/skills · by expoAdd an iOS App Clip target to an Expo app. Use when the user mentions App Clip, AASA, apple-app-site-association, appclips, smart app banner, or wants to ship a lightweight iOS Clip invoked from a URL alongside their parent app.★ 2.7k GitHub starsSkillApp Store Deploy Agentexpo/skills · by expoBuild and submit iOS and Android apps with EAS to TestFlight, the App Store, or Google Play. Supports Expo and other React Native projects, plus existing native apps. Use for eas.json setup, release pipelines, signing, app versions and build numbers, store submissions, and listing metadata. For Expo websites and API routes, use eas-hosting; for adding React Native screens to a native app, use expo-brownfield.★ 2.7k GitHub starsSkillExpo App Hostingexpo/skills · by expoDeploy Expo websites and Expo Router API routes to EAS Hosting - export the web bundle, run eas deploy for production and PR preview URLs, manage environment secrets and custom domains, and work within the Cloudflare Workers runtime. Also covers authoring API routes (+api.ts handlers, HTTP methods, request handling, CORS). Use when deploying an Expo web app or API routes, setting up EAS Hosting, or configuring hosting environments and domains. Not for native builds or store releases - use the eas-app-stores skill for those.★ 2.7k GitHub starsSkillExpo Performance Observerexpo/skills · by expoUse for anything related to EAS Observe - adding `expo-observe` to an Expo project (AppMetricsRoot/ObserveRoot HOC, markInteractive and ObserveInteractiveMarker, the useObserve hook, the Expo Router / React Navigation integrations for per-route metrics, user-defined events via `Observe.logEvent`, error reporting via ObserveErrorBoundary and `Observe.reportError`, and runtime config such as sampleRate and dispatchInDebug), querying via the EAS CLI (`eas observe:metrics-summary`, `observe:metrics`, `observe:routes`, `observe:events`, `observe:session`, `observe:versions`), interpreting the resulting metrics (cold/warm launch, TTR, TTI, navigation cold/warm TTR, update download, and the TTI frameRate/device/network params for triaging slow startups), or shipping an Observe integration inside a third-party package.★ 2.7k GitHub starsSkillRemote Device Simulatorexpo/skills · by expoRun and control a user's app on a remote iOS/Android simulator hosted on EAS cloud. Read before running any `eas simulator:*` commands - it has the current syntax for this experimental API. Use whenever the user needs a simulator they can't run locally - 'run my app on a cloud simulator', 'use eas simulator to run/install/screenshot my app', 'I'm on Linux/Cursor and need an iOS device', 'no sim on this box / headless CI', 'let an agent click through my app and screenshot it', 'test my dev build on a remote sim with live reload', 'stream a sim to my browser' - even when they don't say 'EAS Simulator' or 'cloud'. On a host WITHOUT a local simulator (Linux, CI, cloud sandbox) it's the default; on macOS, do NOT auto-trigger for a plain 'run on the simulator' - use it only for a cloud/remote/shareable sim, an iOS version they lack, or an agent-driven session. NOT for local sims (expo run:ios, Xcode, Android Studio), EAS Build/Update, web preview, or physical devices.★ 2.7k GitHub starsSkillOver-the-Air Update Managerexpo/skills · by expoConfigure and use EAS Update for over-the-air JavaScript and asset updates with expo-updates and EAS CLI. Use when setting up OTA updates, running eas update:configure or eas update, publishing to preview/staging/production channels, explaining branches/channels/runtime versions, testing updates, or debugging why an installed build still shows old code. Load for TestFlight, preview, or production updates that do not appear, including questions about cold launches or reopening the app. Not for update health metrics; use eas-update-insights for adoption, crashes, and rollout monitoring.★ 2.7k GitHub stars