Svelte DevTools — Shared contracts

TypeScript contracts and shared value helpers for Svelte DevTools.

Shares component, runtime event, snapshot, and plugin interfaces across the Vite plugin, browser runtime, panel, and MCP adapter. Applications normally install the plugin; direct consumers should keep package versions aligned.

Get started

For application setup, install the Vite plugin:

npm install -D @fsodano/[email protected] @vitejs/[email protected]

Follow the configuration guide. SvelteKit also needs a development-only handle hook. Requirements: Svelte 5.20+, Vite 8, and a supported Node.js version; Node.js 22.12+ is the documented workflow.

Developer and agent workflows

Inspect individual component instances and source, edit writable JSON state with recorded undo/redo, mock captured browser fetches, and follow explicitly instrumented SQLite calls within SvelteKit request traces. Nine MCP tools let an agent inspect the same data and make acknowledged state edits in a selected live session.

Runtime inspection requires an open, authorized panel. Browser mocks do not intercept server fetch or XMLHttpRequest. Query tracing is explicit and synchronous; Time Travel does not roll back database writes.

See the sample apps and local development guide. After editing panel source, rebuild the client and restart the example server.

Independent community project. Early development; APIs may change. MIT licensed.