Skip to content
LiveNew tools this week
Submit
AIMarketly
svelte-code-writer logo

Svelte 5 Code Writer

svelte-code-writer

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.

aiskillstore/marketplace0installs429stars

SKILL.md

Full skill instructions

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

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: 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