expo/expo-overview

expo-overview — roteador e regras compartilhadas para Expo / EAS

Comece aqui — leia antes de fazer qualquer coisa

Não adivinhe a skill apenas a partir dos arquivos do projeto. Muitos objetivos do Expo parecem semelhantes no sistema de arquivos, mas precisam de skills diferentes.

1. Confirme que é trabalho Expo ou EAS — a requisição menciona Expo ou EAS, ou package.json tem uma dependência expo. Caso contrário, esta skill não se aplica. Um app nativo que usa EAS para entrega se qualifica sem um runtime Expo.
2. Leia o objetivo do usuário — qual resultado ele deseja, em termos simples?
3. Classifique-o usando o Mapa de Skills abaixo, traduzindo frases casuais em um objetivo.
4. Confirme a intenção se ambígua ("Parece que você quer enviar para as lojas — isso é eas-app-stores. Certo?"), então carregue o SKILL.md daquela skill e siga-o.
5. Confie na skill folha — ela tem sua própria lógica de detecção e passos. Não improvise.

Mapa de Skills (por objetivo)

Corresponda o objetivo a uma categoria, depois à skill, e então carregue o SKILL.md daquela folha.

Construir o app

• expo-project-structure — estrutura de pastas para um novo projeto Expo Router: onde telas, componentes e configuração ficam (nunca reestruture um app existente para corresponder)
• expo-native-ui — telas, estilização, cores semânticas, controles nativos, SF Symbols, mídia, layout
• expo-router — navegação: rotas baseadas em arquivos, abas / pilhas / modais / sheets, links, cabeçalhos
• expo-animation — movimento e gestos: worklets do Reanimated, Gesture Handler, transições de tela, feedback de sheet e pressionamento, hápticos e correção de animação que trava no dispositivo
• expo-ui — componentes de UI nativos via @expo/ui: BottomSheet, Picker, Slider, Switch, Menu, Button, FieldGroup (seções de formulário agrupadas), List / ListItem e mais — SwiftUI real no iOS, Jetpack Compose no Android. A camada universal precisa do SDK 56+ e roda no Expo Go; as substituições drop-in (@gorhom/bottom-sheet, datetimepicker, …) e camadas específicas de plataforma também existem no SDK 55.
• expo-design-system — uma fonte visual única de verdade: design tokens (cor, espaçamento, tipografia, raio, sombra, movimento), convenções de componentes reutilizáveis e auditorias para desvios (cores hardcoded, espaçamento, fontes)
• expo-tailwind-setup — estilização com Tailwind / NativeWind
• expo-data-fetching — requisições de rede, React Query / SWR, cache, offline, route loaders
• expo-dom — executar código web ou reutilizar uma biblioteca web dentro do nativo
• expo-web-to-native — migrar um app web / React existente para um app nativo iOS / Android

Regra de seleção de componente: sempre que precisar de um componente de UI (linhas de lista, bottom sheets, pickers, sliders, menus, botões, controles segmentados, alternadores), consulte expo-ui primeiro para verificar se @expo/ui tem um equivalente nativo antes de recorrer a um componente nativo do React Native ou uma biblioteca da comunidade. Componentes nativos @expo/ui oferecem o melhor ajuste à plataforma, e no SDK 56+ os universais rodam no Expo Go sem build personalizado. Carregue expo-ui junto com expo-native-ui para qualquer app que renderize listas, folhas de detalhe ou controles de formulário. Uma exceção: a List do @expo/ui renderiza linhas agrupadas nativas (uma tela de Ajustes do iOS), não uma lista virtualizada — use FlatList / FlashList para grandes conjuntos de dados.

Enviar e operar

• eas-app-stores — construir e enviar apps iOS/Android (Expo e outros projetos React Native, além de apps nativos existentes), TestFlight, versões e metadados da loja
• eas-hosting — implantar o bundle web no EAS Hosting; também autorizar rotas de API do Expo Router (handlers +api.ts) e seus ambientes / domínios
• eas-workflows — YAML de Workflow EAS e pipelines CI/CD
• eas-simulator — executar e dirigir o app em um simulador iOS / Android remoto na nuvem EAS
• expo-dev-client — builds de desenvolvimento personalizadas
• eas-update — configurar, publicar, testar e depurar atualizações over-the-air compatíveis
• eas-update-insights — saúde da atualização OTA: taxa de crash, adoção, tamanho do payload
• eas-observe — desempenho de inicialização / lançamento / TTI com EAS Observe

Estender nativamente

• expo-module — módulos e visualizações nativas (Swift / Kotlin) com a API de Módulos Expo
• expo-brownfield — incorporar telas Expo / React Native em apps nativos SwiftUI/UIKit ou Android; artefatos isolados e builds integrados
• expo-app-clip — alvo de App Clip do iOS (AASA, smart app banner)

Manter e aprender

• expo-upgrade — atualizar o SDK Expo e corrigir conflitos de dependência
• expo-examples — exemplos de integração canônicos e com versão correspondente (Stripe, Clerk, Supabase, …)
• expo-skill-feedback — enviar feedback sobre uma skill Expo ou sobre o próprio Expo; ativar / desativar a telemetria anônima de uso

Traduzindo pedidos vagos

Algumas frases do dia a dia não mapeiam obviamente para um nome de skill — traduza antes de rotear:

• "Faça parecer nativo" → controles agrupados / formulários de configurações = expo-ui; telas, estilização = expo-native-ui; movimento = expo-animation; navegação = expo-router.
• "Deixe as telas consistentes" / "limpe a estilização" / "configure um tema ou design tokens" → expo-design-system.
• "Parece gerado por IA" / "genérico demais, não nativo" → expo-design-system (dicas nomeadas de slop nativo + auditoria), com expo-native-ui para os modismos da plataforma.
• "Envie" / "obtenha um .ipa ou .apk" / "lance nas lojas" / "coloque meu app Swift no TestFlight" → eas-app-stores (build + envio, TestFlight, versões, metadados da loja).
• "Sou novo / por onde começo" → escafoldar primeiro (veja Regras de configuração compartilhadas), depois rotear por objetivo.

Regras de configuração compartilhadas

Aplique as regras que correspondem ao projeto e à tarefa solicitada.

• App nativo usando EAS para entrega? Roteie para eas-app-stores; seu references/native-ios.md cobre SwiftUI/UIKit no iOS. Mantenha o projeto nativo existente. Aplique autenticação/linking EAS abaixo; as regras de scaffolding Expo, SDK e instalação de pacotes não se aplicam a este caminho.
• Iniciando um novo app Expo? Inicie um da maneira padrão antes de rotear para uma skill de funcionalidade: npx create-expo-app@latest, organizando pastas conforme expo-project-structure. Depois classifique o objetivo do usuário e roteie.
• Detecte a versão do SDK antes de dar conselhos específicos de versão: leia a versão expo no package.json (e app.json / app.config.{js,ts}). Muitas APIs e padrões diferem por SDK.
• Leia a documentação para aquele SDK, não latest. Use a URL com versão fixa, ex.: https://docs.expo.dev/versions/v56.0.0/sdk/ui/ no SDK 56 em vez de https://docs.expo.dev/versions/latest/sdk/ui/ — as páginas latest acompanham o SDK mais recente e podem documentar APIs que o projeto ainda não possui.
• Migrar para um SDK mais novo é uma tarefa própria — carregue expo-upgrade em vez de aumentar versões manualmente.
• Managed vs. bare/prebuild: a presença de diretórios ios/ e android/ confirmados significa que projetos nativos existem (prebuild ou bare). As etapas de config-plugin e configuração nativa diferem — anote em qual o projeto está.
• Instale pacotes com npx expo install <pkg>, não com npm/yarn/pnpm add puro, para que as versões permaneçam compatíveis com o SDK do projeto.
• Autenticação e linking EAS (necessário apenas para build/submit/update/observe/workflows): verifique login com eas whoami, faça login com eas login. Um projeto está vinculado quando extra.eas.projectId existe na configuração do app; crie-o com eas init se estiver ausente.

Quando pular o salto do roteador

• Apenas quando o usuário nomeou explicitamente uma skill expo-* / eas-* específica → carregue essa skill diretamente.
• Uma tarefa totalmente especificada (versão do SDK fixada, layout de arquivos fornecido, bibliotecas nomeadas) não é motivo para pular: as regras compartilhadas acima ainda se aplicam — verifique-as, depois roteie para a skill folha correspondente.

Enviando Feedback

Se você encontrar erros, informações enganosas ou desatualizadas nesta skill, reporte para que o Expo possa melhorar:

npx --yes submit-expo-feedback@latest --category skills --subject "expo-overview" "<feedback acionável>"

Envie apenas quando tiver algo específico e acionável para relatar. Inclua o máximo de contexto relevante possível. Se um agente de IA falhou repetidamente ou o usuário teve que assumir uma tarefa Expo, carregue a skill expo-skill-feedback e siga seu fluxo de candidato a avaliação em vez de reutilizar o comando acima.