Generated banner for Svelte Code Writer
Generated logo for Svelte Code Writer

Svelte Code Writer

SvelteOfficialPublished by Svelte

  • Skill
  • Tool integration
  • Software development
  • MIT
  • No issues found

From the author

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` subagent for optimal results.
— the description by Svelte

AutoGineer summary

Written by AutoGineer from the skill’s own files, not by the author

The svelte-code-writer skill provides a set of CLI tools designed to assist developers in working with Svelte 5 components and modules. It enables users to query official documentation directly from the terminal and perform automated code analysis to identify and fix common issues, ensuring adherence to Svelte 5 syntax and best practices.

What it does

  • Lists available Svelte 5 and SvelteKit documentation sections.
  • Retrieves detailed documentation content for specific topics.
  • Analyzes Svelte code for common issues and suggests automated fixes.
  • Supports version-specific analysis for Svelte 4 and 5.
  • Provides an async mode for specialized Svelte component analysis.

When to use it

  • When you need to verify Svelte 5 syntax or documentation details.
  • When debugging or reviewing Svelte components and modules.
  • Before finalizing code to ensure it meets Svelte 5 standards.
  • When migrating or updating code to target specific Svelte versions.

Advantages

  • Reduces context switching by providing documentation access within the terminal.
  • Automates the detection and resolution of common Svelte coding issues.
  • Ensures code compatibility with specific Svelte versions.
  • Integrates seamlessly into development workflows for Svelte projects.

Usage examples

“How do I use runes in Svelte 5?”
The agent uses the tool to list sections, retrieves documentation for $state, $derived, and $effect, and provides a summary of how to implement them.
“Check this component for errors: ./src/components/Header.svelte”
The agent runs the autofixer on the specified file and reports any identified issues or suggested improvements.

Install

  1. Download the skill as a ZIP:

    https://mp-staging.autogineer.com/agent-skills/sveltejs/svelte-code-writer/download
  2. Unzip it into the cross-client skills folder of your project:

    mkdir -p .agents/skills && unzip svelte-code-writer.zip -d .agents/skills

Documentation by Svelte

CLI tools

You have access to @sveltejs/mcp CLI for Svelte-specific assistance. Use these commands via npx:

List documentation sections
npx @sveltejs/mcp list-sections

Lists all available Svelte 5 and SvelteKit documentation sections with titles and paths.

Get documentation
npx @sveltejs/mcp get-documentation "<section1>,<section2>,..."

Retrieves full documentation for specified sections. Use after list-sections to fetch relevant docs.

Example:

npx @sveltejs/mcp get-documentation "$state,$derived,$effect"
Svelte autofixer
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, ideally the full version from package.json (e.g. 5.16.0) so version-specific suggestions are enabled. The major must be 4 or 5 (default: 5)

Examples:

# 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

Files

Requirements and compatibility

Works with: Claude Code, Claude apps, OpenAI Codex, GitHub Copilot, Cursor, Gemini CLI, Kiro, OpenCode, Goose, Amp, Roo Code, JetBrains Junie, Factory Droid, Devin (ex-Windsurf), Mistral Vibe, OpenHands, Letta

“Works with” means the tool reads the open Agent Skills format; a skill written for one tool may use features others lack.

Needs: Needs Node.js

Security

No issues found by our static scan· No issues found

A static scan is not a guarantee. Skills are third-party content: review a skill before you let an agent use it.

Attribution and licence

Published by
Svelte
Publisher
Svelte (Official)
Source
sveltejs/ai-tools · tools/skills/svelte-code-writer · commit d3e755b
Licence
MIT License (redistribution allowed)
  • LICENSE (added by AutoGineer from LICENSE)
  • ATTRIBUTION.md (written by AutoGineer)
Synced
Also distributed in
sveltejs/ai-tools, sveltejs/ai-tools, sveltejs/ai-tools, sveltejs/ai-tools

AutoGineer is not affiliated with or endorsed by Svelte.

Download ZIP

The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download svelte-code-writer.zip