mirror of
https://github.com/sveltejs/ai-tools.git
synced 2026-07-05 03:54:41 +08:00
Compare commits
10 Commits
sync-agent
...
better-sub
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
f81d22df09 | ||
|
|
46d8f6cce8 | ||
|
|
8dc63dca08 | ||
|
|
19fedcd35f | ||
|
|
b4eb5cc960 | ||
|
|
6676fd8116 | ||
|
|
a755a33a5f | ||
|
|
556f96cfaf | ||
|
|
77a3340c2f | ||
|
|
9ac8fd51e7 |
5
.changeset/dark-cows-itch.md
Normal file
5
.changeset/dark-cows-itch.md
Normal file
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@sveltejs/opencode': patch
|
||||
---
|
||||
|
||||
fix: better subagent instructions to use MCP or skill
|
||||
4
.github/workflows/release.yml
vendored
4
.github/workflows/release.yml
vendored
@@ -17,7 +17,7 @@ jobs:
|
||||
name: Release
|
||||
runs-on: ${{ matrix.os }}
|
||||
outputs:
|
||||
published: ${{ steps.changesets.outputs.published }}
|
||||
publishedPackages: ${{ steps.changesets.outputs.publishedPackages }}
|
||||
strategy:
|
||||
matrix:
|
||||
# pseudo-matrix for convenience, NEVER use more than a single combination
|
||||
@@ -64,7 +64,7 @@ jobs:
|
||||
|
||||
publish-mcp:
|
||||
needs: release
|
||||
if: needs.release.outputs.published == 'true'
|
||||
if: contains(needs.release.outputs.publishedPackages, '"@sveltejs/mcp"')
|
||||
uses: ./.github/workflows/publish-mcp.yml
|
||||
secrets:
|
||||
MCP_KEY: ${{ secrets.MCP_KEY }}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
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 MCP Tools:
|
||||
## Available Svelte MCP Tools:
|
||||
|
||||
### 1. list-sections
|
||||
|
||||
|
||||
@@ -33,10 +33,13 @@ The default configuration for the Svelte OpenCode plugin looks like this...
|
||||
},
|
||||
"skills": {
|
||||
"enabled": true
|
||||
},
|
||||
"instructions": {
|
||||
"enabled": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
...but if you prefer, you can enable only the subagent, only the MCP, only the skills, or configure the kind of MCP server you want to use (`local` or `remote`).
|
||||
|
||||
You can place this file in `~/.config/opencode/svelte.json` or, if you have an `OPENCODE_CONFIG_DIR` environment variable specified, at `$OPENCODE_CONFIG_DIR/svelte.json`.
|
||||
You can place this file in `./.opencode/svelte.json` (in your project), in `~/.config/opencode/svelte.json` or, if you have an `OPENCODE_CONFIG_DIR` environment variable specified, at `$OPENCODE_CONFIG_DIR/svelte.json`.
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
## `svelte-code-writer`
|
||||
|
||||
CLI tools for Svelte 5 documentation lookup and code analysis. MUST be used whenever creating or editing 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.
|
||||
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.
|
||||
|
||||
<a href="https://github.com/sveltejs/mcp/releases?q=svelte-code-writer" target="_blank" rel="noopener noreferrer">Open Releases page</a>
|
||||
|
||||
|
||||
@@ -1,5 +1,11 @@
|
||||
# @sveltejs/opencode
|
||||
|
||||
## 0.1.2
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- feat: allow for local opencode config ([#156](https://github.com/sveltejs/mcp/pull/156))
|
||||
|
||||
## 0.1.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
@@ -71,8 +71,15 @@ function get_config_paths() {
|
||||
}
|
||||
}
|
||||
|
||||
// returning config_dir first so it has higher priority
|
||||
return [config_dir_path, global_path];
|
||||
// Project-local: ./.opencode/svelte.json (cwd)
|
||||
let project_path: string | null = null;
|
||||
const project_config = join(process.cwd(), '.opencode', 'svelte.json');
|
||||
if (existsSync(project_config)) {
|
||||
project_path = project_config;
|
||||
}
|
||||
|
||||
// Lowest priority first, highest priority last (project overrides global)
|
||||
return [global_path, config_dir_path, project_path];
|
||||
}
|
||||
|
||||
function load_config_file(config_path: string): ConfigLoadResult {
|
||||
@@ -121,6 +128,9 @@ function merge_with_defaults(user_config: Partial<McpConfig>): McpConfig {
|
||||
|
||||
export function get_mcp_config(ctx: PluginInput) {
|
||||
const config_paths = get_config_paths();
|
||||
let merged: Partial<McpConfig> = {};
|
||||
|
||||
// Iterate from lowest to highest priority, merging as we go
|
||||
for (const path of config_paths) {
|
||||
if (path && existsSync(path)) {
|
||||
const result = load_config_file(path);
|
||||
@@ -129,23 +139,28 @@ export function get_mcp_config(ctx: PluginInput) {
|
||||
ctx.client.tui.showToast({
|
||||
body: {
|
||||
title: 'Svelte: Invalid opencode plugin config',
|
||||
message: `${result.parse_error}\nUsing default values`,
|
||||
message: `${result.parse_error} (${path})\nSkipping this config file`,
|
||||
variant: 'warning',
|
||||
duration: 7000,
|
||||
},
|
||||
});
|
||||
}, 7000);
|
||||
return default_config;
|
||||
continue;
|
||||
}
|
||||
const parsed = v.safeParse(config_schema, result.data);
|
||||
if (parsed.success) {
|
||||
return merge_with_defaults(parsed.output);
|
||||
merged = {
|
||||
mcp: { ...merged.mcp, ...parsed.output.mcp },
|
||||
subagent: { ...merged.subagent, ...parsed.output.subagent },
|
||||
instructions: { ...merged.instructions, ...parsed.output.instructions },
|
||||
skills: { ...merged.skills, ...parsed.output.skills },
|
||||
};
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
ctx.client.tui.showToast({
|
||||
body: {
|
||||
title: 'Svelte: Invalid opencode plugin config',
|
||||
message: `${result.parse_error}\nUsing default values`,
|
||||
message: `Invalid config schema (${path})\nSkipping this config file`,
|
||||
variant: 'warning',
|
||||
duration: 7000,
|
||||
},
|
||||
@@ -155,5 +170,5 @@ export function get_mcp_config(ctx: PluginInput) {
|
||||
}
|
||||
}
|
||||
|
||||
return default_config;
|
||||
return merge_with_defaults(merged);
|
||||
}
|
||||
|
||||
@@ -64,9 +64,71 @@ export const svelte_plugin: Plugin = async (ctx) => {
|
||||
input.agent['svelte-file-editor'] = {
|
||||
color: '#ff3e00',
|
||||
mode: 'subagent',
|
||||
prompt: `You are a specialized Svelte coder. 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 solve them before summarizing the changes for the main agent.`,
|
||||
prompt: `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)
|
||||
`,
|
||||
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. Fetches relevant documentation and validates code using the Svelte MCP server tools.',
|
||||
'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-code-writer` skill if they are available. Fetches relevant documentation and validates code using the Svelte MCP server tools.',
|
||||
permission: {
|
||||
bash: 'ask',
|
||||
edit: 'allow',
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
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 MCP Tools:
|
||||
## Available Svelte MCP Tools:
|
||||
|
||||
### 1. list-sections
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@sveltejs/opencode",
|
||||
"version": "0.1.1",
|
||||
"version": "0.1.2",
|
||||
"type": "module",
|
||||
"license": "MIT",
|
||||
"homepage": "https://github.com/sveltejs/mcp#readme",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
name: svelte-code-writer
|
||||
description: CLI tools for Svelte 5 documentation lookup and code analysis. MUST be used whenever creating or editing 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.
|
||||
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
|
||||
|
||||
@@ -1,11 +1,15 @@
|
||||
---
|
||||
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. Fetches relevant documentation and validates code using the Svelte MCP server tools.
|
||||
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.
|
||||
permissionMode: acceptEdits
|
||||
---
|
||||
|
||||
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
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
name: svelte-code-writer
|
||||
description: CLI tools for Svelte 5 documentation lookup and code analysis. MUST be used whenever creating or editing 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.
|
||||
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
|
||||
|
||||
Reference in New Issue
Block a user