Next Locator – Click to Open Code in IDE

Alt/Ctrl+Click any Next.js element to jump straight to source code in VS Code or Antigravity IDE instantly.

Next Locator is the ultimate developer experience (DX) tool for Next.js developers. Stop wasting time searching through your codebase to find where a UI component lives. With Next Locator, simply hold 'Alt' (or your customized action key) and click any element in your browser — it instantly opens that exact file and line of code in your preferred editor. Supported Editors: VS Code, Antigravity IDE How It Works: 1. Run the setup command in your Next.js project (see below). 2. Start your dev server (npm run dev). 3. Hold Alt + Click on any element in the browser. 4. Your editor opens the exact source file at the correct line. That's it! Features: ⚡ Lightning Fast: Jumps straight to the source file and exact line number. ⚡ Customizable Action Key: Configure your trigger key (Alt / Ctrl / Shift) in the extension popup to avoid conflicts. ⚡ Next.js App Router & Pages Router: Fully compatible with both Next.js routing architectures. ⚡ Turbopack & SWC Compatible: Integrates into your Next.js config without disabling SWC or Turbopack. ⚡ Zero-Touch Setup: One CLI command auto-configures everything. ⚡ Safe & Secure: Only active on localhost in development. Zero impact on production builds. Quick Setup: Run this inside your Next.js project folder: npx @next-locator/cli@latest init Then restart your dev server: npm run dev Note: You must restart your Next.js dev server after running the init command for source detection to activate.