Quick rule
Name the stack. Name the screens. Name the data. Name the tone. Most bad output is one of these four being missing — and the fix is at the prompt level, not the code level.
1. Web patterns sneaking into React Native
Symptoms: div elements, onClick handlers, CSS flexbox that drifts, window.location calls.
Fix: add “React Native” + “Expo Router” explicitly in the prompt. If you’re using NativeWind, say so. If you’re using StyleSheet, say that. LLMs default to web when the target is ambiguous.
2. Content hidden under the notch (no SafeAreaView)
Symptoms: hero text cut off on iPhone 15+, bottom nav covered on Android devices with gesture nav.
Fix: add “respect safe areas” to the tone line. Or name “SafeAreaView” or “react-native-safe-area-context” in the stack. Expo Router handles safe areas automatically when you use its layout components — name that in the prompt.
3. Generic mock data (“John Smith” and “Lorem ipsum”)
Symptoms: user profiles with fake names, posts with placeholder text, menus with “Item 1, Item 2.”
Fix: name the data shape explicitly (tables + fields) and give 2–3 realistic examples. Or name “Supabase” as the data source so the AI generates a data-wiring layer instead of hardcoded arrays.
4. Mixed styling libraries
Symptoms: half the app uses StyleSheet, half uses NativeWind, spots of inline styles, inconsistent spacing.
Fix: pick one styling library and name it in every prompt. Add “only use NativeWind; no StyleSheet” to iteration prompts if drift appears.
5. Missing platform-specific behavior
Symptoms: iOS swipe-to-go-back missing, Android back button doesn’t go back, keyboard covers inputs.
Fix: name “native stack navigator” (not just “stack”) so the AI uses platform-native navigators. Add “handle keyboard avoiding” when input screens are involved.
6. Broken navigation params
Symptoms: tap a list item, the detail screen receives undefined for its param.
Fix: include the full Expo Router route shape in the prompt — e.g., “Profile detail at /profile/[id] receives a user ID.” Or use typed routes (Expo Router has them built-in) and mention it in the prompt.
7. Hallucinated packages and stale APIs
Symptoms: imports of packages that don’t exist, deprecated APIs, outdated Expo SDK patterns.
Fix: name the Expo SDK version (e.g., “Expo SDK 54”) and specify the exact packages you want (“react-native-reanimated 4,” “@tanstack/react-query 5”). If in doubt, use a mobile-specialized AI builder like ShipNative that keeps versions current and avoids stale imports.
How to diagnose: read the output, find the gap
- Open the generated code in an IDE. Don’t just eyeball the preview.
- Look for the symptoms above. Note which of the 7 failures you see.
- Trace back to your prompt — which anchor was missing or vague?
- Rewrite the prompt with the anchor added, then regenerate or iterate.
- If the same failure keeps appearing with a strong prompt, the tool is the problem — switch.
Reset vs iterate: the rule
- Iterate when the change is surface-level — colors, copy, one screen layout, one added button.
- Reset when the change is structural — different nav type, different data layer, different framework choice. Iteration compounds bad decisions; a reset fixes them.
- Carry learnings forward. Every bad output teaches you a prompt anchor to add next time.
When it really is the tool
If you’ve written a strong, structured prompt and the output is still web-flavored junk, the tool is the problem. Web-first AI builders produce web-flavored mobile output regardless of prompt quality. Switch to a mobile-native AI builder — see React Native AI App Builder: How to Choose in 2026 and Lovable, Cursor & v0 for Mobile.