{"id":35094169,"url":"https://github.com/StudentOfJS/svelte5-mcp","last_synced_at":"2026-01-07T10:02:48.679Z","repository":{"id":296395750,"uuid":"993208982","full_name":"StudentOfJS/svelte5-mcp","owner":"StudentOfJS","description":"A specialized Model Context Protocol (MCP) server for Svelte 5 frontend development","archived":false,"fork":false,"pushed_at":"2025-06-08T03:08:27.000Z","size":5453,"stargazers_count":6,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-06-16T07:02:39.216Z","etag":null,"topics":["mcp","mcp-server","svelte","svelte5","sveltekit"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/StudentOfJS.png","metadata":{"files":{"readme":"README.MD","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-05-30T11:58:09.000Z","updated_at":"2025-06-14T05:52:07.000Z","dependencies_parsed_at":"2025-05-30T17:33:24.091Z","dependency_job_id":"cdaabd42-34c9-48ba-a30b-0a9dc72d906b","html_url":"https://github.com/StudentOfJS/svelte5-mcp","commit_stats":null,"previous_names":["studentofjs/svelte5-mcp"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/StudentOfJS/svelte5-mcp","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StudentOfJS%2Fsvelte5-mcp","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StudentOfJS%2Fsvelte5-mcp/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StudentOfJS%2Fsvelte5-mcp/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StudentOfJS%2Fsvelte5-mcp/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/StudentOfJS","download_url":"https://codeload.github.com/StudentOfJS/svelte5-mcp/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StudentOfJS%2Fsvelte5-mcp/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28234560,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2026-01-07T02:00:05.975Z","response_time":58,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["mcp","mcp-server","svelte","svelte5","sveltekit"],"created_at":"2025-12-27T15:04:24.313Z","updated_at":"2026-01-07T10:02:48.674Z","avatar_url":"https://github.com/StudentOfJS.png","language":"TypeScript","funding_links":[],"categories":["📚 Projects (1974 total)"],"sub_categories":["MCP Servers"],"readme":"# Svelte 5 MCP Server\n\nA specialized Model Context Protocol (MCP) server for Svelte 5 frontend development, providing curated knowledge, code examples, and intelligent assistance for modern Svelte development with runes, snippets, and enhanced reactivity.\n\n## Features\n\n### 🔍 **Searchable Resources**\n- **Knowledge Base**: Curated Q\u0026A covering Svelte 5 concepts, runes, and best practices\n- **Code Examples**: Searchable collection of Svelte 5 patterns and component implementations\n\n### 🛠️ **Intelligent Tools**\n- `search_knowledge` - Find explanations and concepts\n- `search_examples` - Discover code patterns and implementations\n- `generate_with_context` - Create components using curated patterns\n- `audit_with_rules` - Review code against Svelte 5 best practices\n- `explain_concept` - Get detailed explanations with examples\n\n### 📝 **Smart Prompts**\n- `generate-component` - Generate modern Svelte 5 components\n- `audit-svelte5-code` - Audit code for optimization opportunities\n- `explain-concept` - Detailed concept explanations\n- `search-patterns` - Find specific implementation patterns\n\n## Installation\n\n```bash\n# Clone and setup\ngit clone \u003crepository-url\u003e\ncd svelte5-mcp-server\n\n# Install dependencies\nnpm install\n\n# Build the server\nnpm run build\n\n# Start the server\nnpm start\n```\n\n## Project Structure\n\n```\nsvelte5-mcp-server/\n├── src/\n│   └── index.ts          # Main MCP server implementation\n├── data/\n│   ├── svelte_5_knowledge.json    # Curated Q\u0026A knowledge base\n│   └── svelte_5_patterns.json     # Code examples and patterns\n├── package.json\n├── tsconfig.json\n├── example system prompt         # Svelte 5 specific system prompt (quite strict, adjust for your own preferences)\n└── README.md\n```\n\n## Usage with Claude Desktop\n\nAdd to your Claude Desktop configuration:\n\n```json\n{\n  \"mcpServers\": {\n    \"svelte5\": {\n      \"command\": \"node\",\n      \"args\": [\"/path/to/svelte5-mcp-server/dist/index.js\"],\n      \"env\": {}\n    }\n  }\n}\n```\n\n## Usage Examples\n\n### 🔍 Search Knowledge\n```\nTool: search_knowledge\nQuery: \"runes reactivity\"\n```\n\nReturns detailed explanations about Svelte 5 runes and the new reactivity system.\n\n### 📚 Find Code Examples\n```\nTool: search_examples  \nQuery: \"counter component $state\"\n```\n\nReturns working Svelte 5 counter implementations using the `$state` rune.\n\n### 🏗️ Generate Components\n```\nTool: generate_with_context\nDescription: \"A todo list with add/remove functionality\"\nFeatures: [\"$state\", \"snippets\", \"accessibility\"]\n```\n\nGenerates a complete todo component using modern Svelte 5 patterns with relevant examples from the knowledge base.\n\n### 🔍 Audit Code\n```\nTool: audit_with_rules\nCode: \"\u003cscript\u003elet count = 0;\u003c/script\u003e\u003cbutton on:click={() =\u003e count++}\u003e{count}\u003c/button\u003e\"\nFocus: \"best-practices\"\n```\n\nAnalyzes code and suggests Svelte 5 improvements (e.g., using `$state` and modern event handling).\n\n## Key Svelte 5 Concepts Covered\n\n### 🎯 **Runes System**\n- `$state` - Reactive state management\n- `$derived` - Computed values and derived state\n- `$effect` - Side effects and lifecycle\n- `$props` - Component properties\n- `$bindable` - Two-way data binding\n- `$inspect` - Development debugging\n\n### 🧩 **Modern Patterns**\n- **Snippets** - Reusable template blocks (`{#snippet}`, `{@render}`)\n- **Enhanced Reactivity** - Fine-grained updates\n- **Event Handling** - Modern `onclick` vs legacy `on:click`\n- **TypeScript Integration** - Better type inference\n- **Accessibility** - Built-in a11y considerations\n\n### 📈 **Migration Support**\n- Svelte 4 → 5 migration patterns\n- Legacy reactive statements (`$:`) → runes\n- Slots → snippets conversion\n- Event dispatcher → callback props\n\n## Data Format\n\n### Knowledge Base (`svelte_5_knowledge.json`)\n```json\n{\n  \"question\": \"How do you manage reactive state in Svelte 5?\",\n  \"answer\": \"In Svelte 5, reactive state is managed using the $state rune...\"\n}\n```\n\n### Examples (`svelte_5_patterns.json`)\n```json\n{\n  \"instruction\": \"Create a Svelte 5 component demonstrating $state\",\n  \"input\": \"The rune allows you to create reactive state...\",\n  \"output\": \"\u003cscript\u003e\\nlet count = $state(0);\\n\u003c/script\u003e\\n\\n\u003cbutton onclick={() =\u003e count++}\u003e\\n  clicks: {count}\\n\u003c/button\u003e\"\n}\n```\n\n## Configuration\n\nThe server uses a better-sqlite3 database and FTS5 queries for search\n\n- **Full-Text Search**: Utilizes SQLite's FTS5 extension for powerful and efficient searching across the knowledge base and code examples.\n- **Tokenization**: Employs the `unicode61` tokenizer with a comprehensive set of separators for robust indexing of terms.\n- **Synonym Expansion**: Enhances search recall by automatically expanding query terms with predefined Svelte 5-specific synonyms (e.g., '$state' also matches 'reactive state').\n- **Result Highlighting**: Search results include highlighted matches within relevant fields (e.g., question, answer, instruction) using FTS5's `highlight()` function.\n- **Relevance Ranking**: Results are ordered by relevance based on FTS5's internal ranking algorithm.\n- **Advanced Boosting**: Offers capabilities for custom scoring and boosting to fine-tune search results, such as prioritizing matches in question fields or code content.\n\n## Development\n\n### Building\n```bash\nnpm run build     # Compile TypeScript\nnpm run dev       # Watch mode for development\n```\n\n### Data Processing\n```bash\nnode process-attached-data.js    # Process curated knowledge\nnode setup-data.js              # Create sample data\n```\n\n### Testing\nThe server provides comprehensive logging and error handling:\n\n```bash\n# Test the server\necho '{\"jsonrpc\": \"2.0\", \"id\": 1, \"method\": \"tools/list\"}' | npm start\n```\n\n## Contributing\n\n### Adding Knowledge\n1. Add entries to `data/svelte_5_knowledge.json`\n2. Format: `{\"question\": \"...\", \"answer\": \"...\"}`\n3. Focus on Svelte 5 specific features and best practices\n\n### Adding Examples  \n1. Add entries to `data/svelte_5_patterns.json`\n2. Format: `{\"instruction\": \"...\", \"input\": \"...\", \"output\": \"...\"}`\n3. Include complete, working Svelte 5 code examples\n\n### Search Optimization\n- Use descriptive, searchable keywords in questions and instructions\n- Include alternative phrasings for common concepts\n- Tag examples with relevant feature names (`$state`, `snippets`, etc.)\n\n## Advanced Usage\n\n### Custom Search Queries\nThe search tools support sophisticated queries:\n\n```typescript\n// Search for state management patterns\nsearch_examples(\"$state reactive updates\")\n\n// Find accessibility guidance\nsearch_knowledge(\"a11y accessibility screen reader\")\n\n// Discover migration patterns\nsearch_examples(\"svelte 4 migration runes\")\n```\n\n### Prompt Chaining\nUse prompts in sequence for complex workflows:\n\n1. `search-patterns` - Find relevant patterns\n2. `generate-component` - Create based on patterns\n3. `audit-svelte5-code` - Review and optimize\n\n### Integration Tips\n- **Claude Desktop**: Best for interactive development\n- **API Integration**: Use programmatically for code generation\n- **CI/CD**: Audit code in automated workflows\n- **Documentation**: Generate examples for style guides\n\n## Troubleshooting\n\n### Common Issues\n\n**\"No results found\"**\n- Check search terms are relevant to Svelte 5\n- Try broader queries first, then narrow down\n- Ensure data files are properly formatted json\n\n**\"Tool not found\"**\n- Verify server is built (`npm run build`)\n- Check MCP client configuration\n- Review server logs for startup errors\n\n**\"Invalid data format\"**\n- Validate JSON files\n- Check for trailing commas or syntax errors\n\n### Debugging\n```bash\n# Enable debug logging\nDEBUG=* npm start\n```\n\n## License\n\nMIT License - see LICENSE file for details.\n\n## Acknowledgments\n\n- Built with [MCP TypeScript SDK](https://github.com/modelcontextprotocol/typescript-sdk)\n- Search db by [better-sqlite3](https://github.com/WiseLibs/better-sqlite3)\n- Validation with [Zod](https://zod.dev/)\n- Curated Svelte 5 knowledge from official documentation and community best practices","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FStudentOfJS%2Fsvelte5-mcp","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FStudentOfJS%2Fsvelte5-mcp","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FStudentOfJS%2Fsvelte5-mcp/lists"}