React NativeMetroBundler
Metro caches aggressively for speed, but that cache goes stale after you add packages, rename files, or switch branches. Most 'Unable to resolve module' errors are just a cache that needs clearing.
The Error
Error: Unable to resolve module ./Foo — None of these files exist (even though it clearly does).
The Reset Sequence
bash
# 1. Start Metro with a clean cache
npx react-native start --reset-cache
# 2. If that's not enough, clear watchman + temp caches
watchman watch-del-all
rm -rf $TMPDIR/metro-* $TMPDIR/haste-map-*
rm -rf node_modules && npm installCheck Your Imports' Casing
After cache issues, the next most common cause is a case-mismatched import that works on macOS but breaks resolution. ./components/button vs ./components/Button — make them identical.
Add a Script
Put "reset": "watchman watch-del-all && rm -rf $TMPDIR/metro-* && npm start -- --reset-cache" in package.json so the whole team has a one-command fix.
