Mcp Svelte Docs

What is Mcp Svelte Docs about?

Mcp Svelte Docs provides a Model Context Protocol (MCP) server exposing the full set of Svelte 5 and SvelteKit definitions directly extracted from the official TypeScript declarations. A single svelte_definition tool covers all Svelte runes, modern features, event handling patterns, migration guidance, and TypeScript interfaces.

How to use Mcp Svelte Docs?

Call the tool via the MCP interface:

svelte_definition(identifier: string, format?: "syntax" | "quick" | "full")

• identifier selects the Svelte concept (e.g., $state, snippets, migration-patterns).
• format controls verbosity: syntax for a concise signature, quick for a short definition with example, full for complete documentation (default). The server can be started with npx -y mcp-svelte-docs and configured in any MCP‑compatible client (Cursor, Windsurf, etc.).

Key Features

• Authoritative & TypeScript‑First: Definitions are generated straight from Svelte’s source typings, ensuring accuracy and type safety.
• Single Unified Interface: One tool replaces dozens of specialized utilities, offering consistent responses.
• Comprehensive Coverage: 28+ identifiers include all runes ($state, $derived, $effect family), modern features (await-expressions, remote‑functions), event handling, migration patterns, and TS interfaces.
• Smart Error Recovery: Fuzzy matching suggests correct identifiers and points to related concepts.
• Multiple Response Formats: Choose between terse signatures, quick overviews, or full documentation with examples.
• Cross‑Platform Installation: Works via WSL, macOS, Linux, and native Windows using npx.

Use Cases

• IDE/Editor Integration: Provide instant, type‑safe hover docs or autocomplete for Svelte developers.
• Learning & Onboarding: Quickly retrieve concise or detailed explanations of any Svelte rune or pattern.
• Migration Assistance: Query migration-patterns to convert Svelte 4 code to Svelte 5 idioms.
• Automated Documentation Generation: Pull full definitions for generating project documentation or cheat sheets.
• Tooling Extension: Build custom linting, static analysis, or code‑assist plugins that query the server for accurate definitions.

FAQ

Q: Do I need to install Svelte locally? A: No. The server extracts definitions directly from the official Svelte 5 TypeScript package, so a separate Svelte installation is not required.

Q: How are updates handled? A: Running npx -y mcp-svelte-docs always pulls the latest published version, keeping the definitions in sync with the upstream Svelte releases.

Q: Can I query multiple identifiers at once? A: The current API accepts a single identifier per call. Clients can batch requests by invoking the tool repeatedly.

Q: What if I misspell an identifier? A: The server performs fuzzy matching and returns suggestions or the closest matching definition.

Q: Is there a limit on request rate? A: The package does not enforce a rate limit; typical local usage is unrestricted.

mcp-svelte-docs

A Model Context Protocol (MCP) server providing authoritative Svelte 5 and SvelteKit definitions extracted directly from TypeScript declarations. Get precise syntax, parameters, and examples for all Svelte 5 concepts through a single, unified interface.

Architecture

Definition-First Approach: Rather than multiple specialized tools, this server provides one powerful svelte_definition tool that accesses 28+ comprehensive definitions covering:

• All Svelte 5 runes ($state,$derived, $props,$effect variants)
• Modern features (snippets, await expressions, remote functions)
• Event handling (DOM events, custom events, component communication)
• Migration guidance (Svelte 4 to 5 patterns and best practices)
• TypeScript interfaces (Snippet, Snapshot types)
• Advanced patterns (global state, common mistakes, lifecycle equivalents)

Available Tool

svelte_definition

Single, powerful tool for all Svelte 5 and SvelteKit concepts:

svelte_definition(identifier: string, format?: "syntax"|"quick"|"full")

Examples:

• svelte_definition("$state") - Complete $state documentation
• svelte_definition("snippets", "quick") - Snippet overview with example
• svelte_definition("onclick", "syntax") - Just the TypeScript signature
• svelte_definition("migration-patterns") - Svelte 4 → 5 migration guide

Response Formats:

• "syntax" - TypeScript signature only (~50 words)
• "quick" - Definition + minimal example (~200 words)
• "full" - Complete documentation with examples (~500-1000 words, default)

Available Identifiers (28+)

Core Runes: $state, $state.raw, $state.snapshot, $derived, $derived.by, $props, $bindable, $effect, $effect.pre, $effect.root, $effect.pending, $effect.tracking

Development Tools: $inspect, $host

Features & Patterns: snippets, onclick, component-events, migration-patterns, await-expressions, remote-functions, global-state, common-mistakes, lifecycle-equivalents

Event Handling: custom-events, event-delegation, event-modifiers

TypeScript Interfaces: snippet, snapshot

Key Features

🎯 Authoritative & TypeScript-First

• Direct from Source: Definitions extracted from official Svelte 5 TypeScript declarations
• Always Current: Reflects the actual API, not outdated tutorials
• Type-Safe: Includes precise parameter types, return values, and constraints

⚡ Single Interface, Complete Coverage

• One Tool: svelte_definition replaces 16+ specialized tools
• 28+ Definitions: Every Svelte 5 rune, feature, and pattern covered
• Consistent Responses: Same interface whether you need $state or remote-functions

🚀 Modern Svelte 5 & SvelteKit Support

• Await Expressions: Async operations directly in templates (await-expressions)
• Remote Functions: Type-safe client-server communication (remote-functions)
• All Runes: Complete $effect family, $state variants, $derived.by, $bindable
• Advanced Patterns: Event handling, global state, component communication

📚 Smart Error Recovery

• Fuzzy Matching: Suggests correct identifiers for typos
• Related Concepts: Points to similar definitions when searches fail
• Migration Help: Converts Svelte 4 patterns to Svelte 5 equivalents

Config

Claude Desktop (via WSL)

{
	"mcpServers": {
		"mcp-svelte-docs": {
			"command": "wsl.exe",
			"args": ["bash", "-c", "npx -y mcp-svelte-docs"]
		}
	}
}

Cursor

Windsurf (via WSL)

{
	"mcpServers": {
		"mcp-svelte-docs": {
			"command": "wsl.exe",
			"args": ["bash", "-c", "npx -y mcp-svelte-docs"]
		}
	}
}

Windows (without WSL)

{
	"mcpServers": {
		"mcp-svelte-docs": {
			"command": "npx",
			"args": ["-y", "mcp-svelte-docs"]
		}
	}
}

macOS / Linux

{
	"mcpServers": {
		"mcp-svelte-docs": {
			"command": "npx",
			"args": ["-y", "mcp-svelte-docs"]
		}
	}
}

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT License - see the LICENSE file for details.

Acknowledgments

Built on:

• Model Context Protocol
• Svelte