Skip to main content

Expo Dev Tools

Built-in development tools from the Expo CLI for debugging your mobile app on a device or simulator while npx expo start is running. Use this page for Expo Go and development builds. For Studio web preview in the browser, use Chrome DevTools.

Platform support:

  • ❌ Web preview
  • ✅ Expo Go / development build (development mode)
  • ❌ Release build (APK/IPA): use WavePulse for WaveMaker debugging on installed builds
Primary debugger

For full debugging (Console, Sources, Network, Components), use React Native DevTools. Press j in the Expo CLI terminal after the app is running, or choose Open DevTools from the developer menu on the device or simulator.

Use the sections below for the developer menu, performance overlay, and element inspector. For WaveMaker widgets, variables, and services on device, also see WavePulse.

Run the app with Expo CLI

Export or run your mobile app, then start the dev server from the project directory. See Expo Go / Development Build in the debugging overview and Mobile build overview for export and run options.

npx expo start

Connect a device or simulator (i for iOS simulator, a for Android emulator, or scan the QR code for a physical device).

If logs are missing in the console, set "enableLogs": true under preferences in src/main/webapp/wm_rn_config.json and restart the dev server. See Enabling logs in WaveMaker mobile app.

Expo CLI shortcuts

While the dev server is running, use these keys in the terminal:

# Press 'j' - Open React Native DevTools
# Press 'm' - Open developer menu on connected device/simulator
# Press 'shift + m' - More tools menu (plugins and extra actions)
# Press 'r' - Reload app
# Press '?' - Show all options

Press ? anytime to see the full list for your installed Expo CLI version.

Developer menu

Open the developer menu on the running app:

  • Terminal: Press m where npx expo start is running
  • Physical device: Shake the device
  • iOS Simulator: Cmd + D, or Ctrl + Cmd + Z
  • Android Emulator: Cmd + M (Mac) or Ctrl + M (Windows/Linux)

Common options:

  • Reload
  • Open DevTools (React Native DevTools; includes React component inspection)
  • Toggle element inspector
  • Toggle performance monitor
  • Go Home (return to Expo Go or dev client home)
  • Fast Refresh (toggle automatic JS reload on save)

Remote JavaScript debugging is deprecated on current React Native stacks that use Hermes. Use Open DevTools or j in the terminal instead.

Performance monitor

Enable from the developer menu (Toggle performance monitor) or from the Expo CLI More tools menu (Shift + m).

Displays:

  • RAM usage
  • JavaScript heap size
  • View counts
  • UI and JS thread frame rates

Element inspector

Enable from the developer menu (Toggle element inspector) or from the Expo CLI More tools menu (Shift + m).

Features:

  • Tap components to inspect
  • View component props and styles
  • Navigate the component hierarchy
  • Highlight component boundaries

For deeper React inspection, use React Native DevTools (j in the terminal or Open DevTools in the menu).


React Native Debugger (standalone, legacy)

The standalone React Native Debugger relied on remote JS debugging, which is deprecated on Hermes-based apps. WaveMaker mobile apps use Hermes; prefer React Native DevTools instead.

If you maintain an older project that still supports remote debugging, install from the GitHub releases or brew install --cask react-native-debugger on macOS.


Primary Debugging Tools:

Additional Debugging Tools:

  • Reactotron – Community debugging tool with custom logging

Testing Documentation:

Build Documentation:

External Resources:

tip

Start with React Native DevTools (j in the terminal) for day-to-day debugging. Use this page when you need the on-device developer menu, performance overlay, or element inspector.