TanStack Devtools

TanStack Devtools is a unified debugging panel for building and integrating developer tools within applications. It provides a shared infrastructure that includes trigger controls, tabs, window management, settings persistence, hotkeys, source inspection, and client-server logging. The framework-agnostic architecture lets library and product teams create custom inspectors as plugins while sharing core functionality. Developers can register panels alongside TanStack library inspectors and communicate through typed events over local connections, WebSocket, or server-sent events. The system handles element and log source location mapping to the editor.

Developed by TanStack, the tool works across multiple frameworks including React, Vue, Solid, and Preact. Rather than rebuilding debugging shells around individual panels, teams can focus on exposing the runtime state relevant to their library or product. The custom plugin system allows products to provide their own devtools alongside existing inspectors. TanStack Devtools is released under the MIT license.