by instructa
⚡ Stream browser logs to terminal, zero setup, perfect for Ai Agents
# Add to your Claude Code skills
git clone https://github.com/instructa/browser-echo
browser-echo makes it easy for you to read client-side logs directly in your coding agent during development.
🤖 AI Coding Assistant Support - Perfect for Cursor AI, Claude Code, GitHub Copilot CLI, Gemini CLI, and other code editors that read terminal output
🚀 Framework Support - React, Vue, Nuxt 3/4, Next.js, TanStack Start, Vite-based frameworks, and custom setups
First, set up Browser Echo for your framework:
| Framework | Quick Setup | | --- | --- | | TanStack / Vite | Installation Guide | | Nuxt 3/4 | Installation Guide | | Next.js (App Router) | Installation Guide | | Vue + Vite | Installation Guide | | React + Vite | Installation Guide | | Vue (non-Vite) | Installation Guide | | React (non-Vite) | Installation Guide | | Core | Installation Guide |
⚠️ IMPORTANT: You must complete step 1 (framework setup) first before MCP will work. The MCP server needs your frameworks server to forward browser logs to it.
📖 Set up Browser Echo MCP Server for AI assistant integration

Stream browser logs to your dev terminal and optional file logging.
No comments yet. Be the first to share your thoughts!
console.*browser-echo makes it easy for you (and your AI coding assistant) to read client-side logs directly in the server terminal during development.
💡 Tip: The MCP server isn't required for most use cases. AI assistants are usually smart enough to read CLI output directly, and the terminal solution is often faster and cheaper than MCP integration. The MCP was designed to avoid polluting the context window, but in most cases the terminal output is sufficient.
console.log/info/warn/error/debugsendBeacon when possible)(file:line:col) + stack tracesNo production impact. Providers enable this across frameworks by injecting a tiny client patch and exposing a dev-only HTTP endpoint.
console.* in prod builds, use your bundler’s strip tools (e.g. Rollup plugin) separately./mcp → Choose "browser-echo" → Enter → Hit 2 to reconnectindex.html exists or you import the virtual module manuallymodules[] and you're in dev modeapp/api/client-logs/route.ts is exported and <BrowserEchoScript /> is rendered in <head>base or proxy? Keep the route same‑origin and not behind auth['warn','error'] and use stackMode: 'condensed'preserveConsole: false in your configurationIf you're running multiple MCP servers in different projects and seeing logs from unrelated projects, ensure each project has its own .browser-echo-mcp.json file in its root directory:
Check for ancestor config files: Look for .browser-echo-mcp.json files in parent directories (e.g., ~/projects/.browser-echo-mcp.json). If found, delete them or move them to specific project roots.
Use distinct ports: Start each MCP server with a unique port:
# In project A
browser-echo-mcp --port 5179
# In project B
browser-echo-mcp --port 5180
Verify project isolation: Ensure each MCP server was started from within its own project directory (not from a shared parent).
Check process CWD: If using IDE integrations or task runners, make sure each MCP server process has its CWD set to the individual project root.
If the issue persists after following these steps, please open an issue on GitHub with details about your setup.
MIT