Compare commits

...

1 Commits

Author SHA1 Message Date
paoloricciuti
2c57dd30c1 feat: cursor plugin 2026-02-22 13:27:29 +01:00
8 changed files with 351 additions and 1 deletions

View File

@@ -0,0 +1,86 @@
name: Sync Cursor Plugin
on:
push:
branches:
- main
paths:
- 'plugins/svelte/skills/**'
- 'plugins/svelte/agents/**'
- 'instructions/AGENTS.md'
permissions:
contents: write
pull-requests: write
jobs:
sync-cursor:
# prevents this action from running on forks
if: github.repository == 'sveltejs/mcp'
name: Sync Cursor Plugin from Sources of Truth
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v6
with:
fetch-depth: 0
- name: Setup Node.js
uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
with:
node-version: 24
package-manager-cache: false # pnpm is not installed yet
- name: Install pnpm
shell: bash
run: |
PNPM_VER=$(jq -r '.packageManager | if .[0:5] == "pnpm@" then .[5:] else "packageManager in package.json does not start with pnpm@\n" | halt_error(1) end' package.json)
echo installing pnpm version $PNPM_VER
npm i -g pnpm@$PNPM_VER
- name: Setup Node.js with pnpm cache
uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
with:
node-version: 24
package-manager-cache: true # caches pnpm via packageManager field in package.json
cache: 'pnpm'
- name: Install dependencies
run: pnpm install --frozen-lockfile --prefer-offline --ignore-scripts
- name: Sync Cursor plugin
run: pnpm sync-cursor-plugin
- name: Check for changes
id: git-check
run: |
git diff --exit-code svelte-cursor/ || echo "changed=true" >> $GITHUB_OUTPUT
- name: Create Pull Request
if: steps.git-check.outputs.changed == 'true'
uses: peter-evans/create-pull-request@c0f553fe549906ede9cf27b5156039d195d2ece0 # v8.1.0
with:
token: ${{ secrets.GITHUB_TOKEN }}
commit-message: 'chore: sync Cursor plugin from sources of truth'
branch: chore/sync-cursor-plugin
delete-branch: true
title: 'chore: sync Cursor plugin from sources of truth'
body: |
## Summary
Automatically synced the Cursor plugin from sources of truth.
This PR was triggered by changes to one or more of:
- `plugins/svelte/skills/**` (skills)
- `plugins/svelte/agents/**` (agent definitions)
- `instructions/AGENTS.md` (agent instructions/rules)
## Changes
- Synced `svelte-cursor/skills/` with latest skill definitions
- Synced `svelte-cursor/agents/` with latest agent definitions (stripped Claude-specific fields)
- Synced `svelte-cursor/rules/` with latest instructions from AGENTS.md
## Generated by
GitHub Action: Sync Cursor Plugin
labels: |
chore
automated

View File

@@ -26,7 +26,8 @@
"release": "pnpm --filter @sveltejs/mcp run build && changeset publish", "release": "pnpm --filter @sveltejs/mcp run build && changeset publish",
"changeset:version": "changeset version && pnpm --filter @sveltejs/mcp run update:version && git add --all", "changeset:version": "changeset version && pnpm --filter @sveltejs/mcp run update:version && git add --all",
"sync-opencode-skills": "rm -rf packages/opencode/skills && cp -r plugins/svelte/skills packages/opencode/skills", "sync-opencode-skills": "rm -rf packages/opencode/skills && cp -r plugins/svelte/skills packages/opencode/skills",
"sync-agents-md": "rm -f packages/opencode/instructions/opencode-agents.md && rm -f documentation/docs/10-introduction/.generated/agents.md && mkdir -p packages/opencode/instructions && mkdir -p documentation/docs/10-introduction/.generated && cp instructions/AGENTS.md packages/opencode/instructions/opencode-agents.md && cp instructions/AGENTS.md documentation/docs/10-introduction/.generated/agents.md" "sync-agents-md": "rm -f packages/opencode/instructions/opencode-agents.md && rm -f documentation/docs/10-introduction/.generated/agents.md && mkdir -p packages/opencode/instructions && mkdir -p documentation/docs/10-introduction/.generated && cp instructions/AGENTS.md packages/opencode/instructions/opencode-agents.md && cp instructions/AGENTS.md documentation/docs/10-introduction/.generated/agents.md",
"sync-cursor-plugin": "node scripts/sync-cursor-plugin.ts"
}, },
"keywords": [ "keywords": [
"svelte", "svelte",

View File

@@ -0,0 +1,85 @@
import fs from 'node:fs/promises';
import path from 'node:path';
const CURSOR_PLUGIN_DIR = './svelte-cursor';
const CLAUDE_PLUGIN_DIR = './plugins/svelte';
const AGENTS_MD_PATH = './instructions/AGENTS.md';
/**
* Sync skills from Claude plugin to Cursor plugin (direct copy)
*/
async function sync_skills() {
const source = path.join(CLAUDE_PLUGIN_DIR, 'skills');
const dest = path.join(CURSOR_PLUGIN_DIR, 'skills');
await fs.rm(dest, { recursive: true, force: true });
await fs.cp(source, dest, { recursive: true });
console.log('Synced skills to Cursor plugin');
}
/**
* Sync agent definition from Claude plugin to Cursor plugin,
* stripping Claude-specific frontmatter fields (permissionMode)
*/
async function sync_agents() {
const source = path.join(CLAUDE_PLUGIN_DIR, 'agents');
const dest = path.join(CURSOR_PLUGIN_DIR, 'agents');
await fs.rm(dest, { recursive: true, force: true });
await fs.mkdir(dest, { recursive: true });
const files = await fs.readdir(source);
for (const file of files) {
if (!file.endsWith('.md')) continue;
const content = await fs.readFile(path.join(source, file), 'utf-8');
// Strip Claude-specific frontmatter fields
const transformed = content.replace(
/^(---\n)([\s\S]*?)(---\n)/m,
(_match, open, frontmatter, close) => {
const filtered_lines = (frontmatter as string)
.split('\n')
.filter((line: string) => !line.startsWith('permissionMode:'))
.join('\n');
return `${open}${filtered_lines}${close}`;
},
);
await fs.writeFile(path.join(dest, file), transformed);
}
console.log('Synced agents to Cursor plugin');
}
/**
* Sync AGENTS.md instructions as a Cursor rule (.mdc file with frontmatter)
*/
async function sync_rules() {
const dest = path.join(CURSOR_PLUGIN_DIR, 'rules');
await fs.rm(dest, { recursive: true, force: true });
await fs.mkdir(dest, { recursive: true });
const agents_content = await fs.readFile(AGENTS_MD_PATH, 'utf-8');
const rule_content = `---
description: Instructions for using the Svelte MCP server tools for documentation lookup, code analysis, and validation
alwaysApply: true
---
${agents_content.trim()}
`;
await fs.writeFile(path.join(dest, 'svelte-mcp-tools.mdc'), rule_content);
console.log('Synced rules to Cursor plugin');
}
await sync_skills();
await sync_agents();
await sync_rules();
console.log('Cursor plugin sync complete');

View File

@@ -0,0 +1,9 @@
{
"name": "svelte",
"description": "A plugin for all things related to Svelte development, MCP, skills, and more.",
"version": "1.0.0",
"author": {
"name": "Svelte"
},
"keywords": ["svelte", "sveltekit", "mcp", "autofixer"]
}

8
svelte-cursor/.mcp.json Normal file
View File

@@ -0,0 +1,8 @@
{
"mcpServers": {
"svelte": {
"type": "http",
"url": "https://mcp.svelte.dev/mcp"
}
}
}

View File

@@ -0,0 +1,67 @@
---
name: svelte-file-editor
description: Specialized Svelte 5 code editor. MUST BE USED PROACTIVELY when creating, editing, or reviewing any .svelte file or .svelte.ts/.svelte.js module and MUST use the tools from the MCP server or the `svelte-file-editor` skill if they are available. Fetches relevant documentation and validates code using the Svelte MCP server tools.
---
You are a Svelte 5 expert responsible for writing, editing, and validating Svelte components and modules. You have access to the Svelte MCP server which provides documentation and code analysis tools. Always use the tools from the svelte MCP server to fetch documentation with `get_documentation` and validating the code with `svelte_autofixer`. If the autofixer returns any issue or suggestions try to solve them.
If the MCP tools are not available you can use the `svelte-code-editor` skill to learn how to use the `@sveltejs/mcp` cli to access the same tools.
If the skill is not available you can run `npx @sveltejs/mcp@latest -y --help` to learn how to use it.
## Available MCP Tools
### 1. list-sections
Lists all available Svelte 5 and SvelteKit documentation sections with titles and paths. Use this first to discover what documentation is available.
### 2. get-documentation
Retrieves full documentation for specified sections. Accepts a single section name or an array of section names. Use after `list-sections` to fetch relevant docs for the task at hand.
**Example sections:** `$state`, `$derived`, `$effect`, `$props`, `$bindable`, `snippets`, `routing`, `load functions`
### 3. svelte-autofixer
Analyzes Svelte code and returns suggestions to fix issues. Pass the component code directly to this tool. It will detect common mistakes like:
- Using `$effect` instead of `$derived` for computations
- Missing cleanup in effects
- Svelte 4 syntax (`on:click`, `export let`, `<slot>`)
- Missing keys in `{#each}` blocks
- And more
## Workflow
When invoked to work on a Svelte file:
### 1. Gather Context (if needed)
If you're uncertain about Svelte 5 syntax or patterns, use the MCP tools:
1. Call `list-sections` to see available documentation
2. Call `get-documentation` with relevant section names
### 2. Read the Target File
Read the file to understand the current implementation.
### 3. Make Changes
Apply edits following Svelte 5 best practices:
### 4. Validate Changes
After editing, ALWAYS call `svelte-autofixer` with the updated code to check for issues.
### 5. Fix Any Issues
If the autofixer reports problems, fix them and re-validate until no issues remain.
## Output Format
After completing your work, provide:
1. Summary of changes made
2. Any issues found and fixed by the autofixer
3. Recommendations for further improvements (if any)

View File

@@ -0,0 +1,28 @@
---
description: Instructions for using the Svelte MCP server tools for documentation lookup, code analysis, and validation
alwaysApply: true
---
You are able to use the Svelte MCP server, where you have access to comprehensive Svelte 5 and SvelteKit documentation. Here's how to use the available tools effectively:
## Available Svelte MCP Tools:
### 1. list-sections
Use this FIRST to discover all available documentation sections. Returns a structured list with titles, use_cases, and paths.
When asked about Svelte or SvelteKit topics, ALWAYS use this tool at the start of the chat to find relevant sections.
### 2. get-documentation
Retrieves full documentation content for specific sections. Accepts single or multiple sections.
After calling the list-sections tool, you MUST analyze the returned documentation sections (especially the use_cases field) and then use the get-documentation tool to fetch ALL documentation sections that are relevant for the user's task.
### 3. svelte-autofixer
Analyzes Svelte code and returns issues and suggestions.
You MUST use this tool whenever writing Svelte code before sending it to the user. Keep calling it until no issues or suggestions are returned.
### 4. playground-link
Generates a Svelte Playground link with the provided code.
After completing the code, ask the user if they want a playground link. Only call this tool after user confirmation and NEVER if code was written to files in their project.

View File

@@ -0,0 +1,66 @@
---
name: svelte-code-writer
description: CLI tools for Svelte 5 documentation lookup and code analysis. MUST be used whenever creating, editing or analyzing any Svelte component (.svelte) or Svelte module (.svelte.ts/.svelte.js). If possible, this skill should be executed within the svelte-file-editor agent for optimal results.
---
# Svelte 5 Code Writer
## CLI Tools
You have access to `@sveltejs/mcp` CLI for Svelte-specific assistance. Use these commands via `npx`:
### List Documentation Sections
```bash
npx @sveltejs/mcp list-sections
```
Lists all available Svelte 5 and SvelteKit documentation sections with titles and paths.
### Get Documentation
```bash
npx @sveltejs/mcp get-documentation "<section1>,<section2>,..."
```
Retrieves full documentation for specified sections. Use after `list-sections` to fetch relevant docs.
**Example:**
```bash
npx @sveltejs/mcp get-documentation "$state,$derived,$effect"
```
### Svelte Autofixer
```bash
npx @sveltejs/mcp svelte-autofixer "<code_or_path>" [options]
```
Analyzes Svelte code and suggests fixes for common issues.
**Options:**
- `--async` - Enable async Svelte mode (default: false)
- `--svelte-version` - Target version: 4 or 5 (default: 5)
**Examples:**
```bash
# Analyze inline code (escape $ as \$)
npx @sveltejs/mcp svelte-autofixer '<script>let count = \$state(0);</script>'
# Analyze a file
npx @sveltejs/mcp svelte-autofixer ./src/lib/Component.svelte
# Target Svelte 4
npx @sveltejs/mcp svelte-autofixer ./Component.svelte --svelte-version 4
```
**Important:** When passing code with runes (`$state`, `$derived`, etc.) via the terminal, escape the `$` character as `\$` to prevent shell variable substitution.
## Workflow
1. **Uncertain about syntax?** Run `list-sections` then `get-documentation` for relevant topics
2. **Reviewing/debugging?** Run `svelte-autofixer` on the code to detect issues
3. **Always validate** - Run `svelte-autofixer` before finalizing any Svelte component