Effortless UI Context for AI Coding: Inside ViteLens for React & Vite

ViteLens, an open-source developer tool for React and Vite, lets developers Ctrl+Click multiple UI elements on localhost to generate structured Markdown context tables for AI coding assistants like OpenAI Codex, Cursor, Claude Code, and GitHub Copilot. It also supports recording user flows to export Playwright or Cypress tests and Alt+Click to jump to source code, with runtime code excluded from production builds.

When prompting AI coding tools like OpenAI Codex , Cursor , Claude Code , or GitHub Copilot to refactor a frontend component, providing accurate visual context DOM hierarchy, CSS classes, container dimensions is often a bottleneck. ViteLens solves this by letting you Ctrl + Click multiple UI elements on localhost and 1-click copy structured Markdown context tables directly into your prompt. When asking an AI model to restyle a complex React/Vue/Svelte view, developers frequently have to: This friction slows down the AI-assisted development loop. Press Ctrl + Click across any UI elements on your page to select them simultaneously. ViteLens generates a clean, structured Markdown table containing: You can paste this directly into Codex, Cursor, or Claude Code for instant, high-accuracy refactoring. Need to write E2E tests? Click Record User Flow , click through your workflow in the browser, and export a ready-to-run Playwright or Cypress test suite. Hover over any element and press Alt + Click to jump directly to the source file, line, and column in your editor Cursor, VS Code, Windsurf, WebStorm, Zed, Sublime . npx vite-lens dev npm install -D vite-lens python // vite.config.ts import { defineConfig } from 'vite'; import react from '@vitejs/plugin-react'; import { viteLens } from 'vite-lens'; export default defineConfig { plugins: react , viteLens { editor: 'auto' } , } ; Developer tools should never leak into production. ViteLens uses Vite's apply: 'serve' lifecycle hook to ensure all runtime code is physically omitted from production bundles vite build . ViteLens is 100% open-source under the MIT license: