See It In Action
Watch how easy it is to inspect and navigate to source code
Developer Experience First
Speed up your development workflow with powerful inspection tools
Click to Inspect
Tap any component to see its source location, styles, and component hierarchy.
Instant Navigation
Jump directly to the exact line of code in your IDE with one click.
Zero Production Overhead
Babel plugin only adds metadata in development. No impact on production builds.
Auto Editor Detection
Automatically detects VS Code, Cursor, WebStorm, and other running editors.
Works With Your Stack
Seamless integration with Expo and bare React Native projects
Supported Editors
Open source files in your favorite code editor
How It Works
Three-step process from tap to editor
Build Time
Babel plugin injects source location metadata into JSX elements during compilation
Runtime
Inspector component captures taps and extracts source info from the React fiber tree
Dev Server
Metro middleware receives the request and launches your editor at the correct file:line
Quick Start
Get up and running in minutes
Expo
npx expo install react-native-dev-inspector @rn-dev-inspector/expo-pluginReact Native CLI
npm install react-native-dev-inspector @rn-dev-inspector/babel-plugin @rn-dev-inspector/metro-plugin