Svelte
Svelte/SvelteKit 应用构建、调试与迁移专家
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：Svelte。 它的用途是：Svelte/SvelteKit 应用构建、调试与迁移专家 完整的 Skill 内容见：https://321skill.com/skills/svelte-x-2/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
‘我的SvelteKit项目在hydration时出现“markup mismatches”错误，控制台提示预期内容与实际渲染不一致，代码中使用了{#if}判断浏览器环境，请帮我排查。’ 它会分析模板和服务端渲染逻辑，指出{#if}条件在服务端和客户端不一致的根源，并建议使用onMount或browser变量来安全地处理浏览器特有代码。
介绍
解决 Svelte 和 SvelteKit 开发中常见的棘手问题，包括 UI 状态更新不及时、effect 无限循环（effect_update_depth_exceeded）、props 或 bindings 失去响应、Map 或 class 字段未被追踪、服务端用户间状态泄漏、构建时出现 “window is not defined” 错误、hydration 标记不匹配、数据在 mutation 后仍显示旧值、form action 无响应或返回 403、scoped CSS 被误删、过渡动画不触发，以及 Node、Vercel、Cloudflare 或静态适配器构建失败等。
使用时，只需将你的代码或错误信息提供给该 Skill，它会自动分析问题根源，并给出修复方案。支持交互式提问，可逐步排查复杂 Bug，也能整体审查代码质量。对于迁移场景，它能识别 Svelte 4 到 Svelte 5 的关键差异，并自动转换 export let 到 $props、$: 到 $derived、createEventDispatcher 到回调 props、slots 到 snippets、on:click 到 onclick 等，同时提供 TypeScript 类型标注优化建议。
适合使用 Svelte 或 SvelteKit 的前端开发、全栈开发、测试工程师，以及正在学习 Svelte 5 新特性（runes、stores、snippets）的开发者。也适合需要将旧项目迁移到新规范的团队，或是希望减少 bundle 体积和重渲染成本的优化阶段。
建议在遇到 Svelte 特有错误时优先使用，能显著缩短排查时间。对于跨框架问题（如 Vue/React）或纯浏览器 JavaScript 语义，该 Skill 无法提供帮助。迁移时请确保代码有版本控制，以便回退。
核心特点
相比通用代码调试助手，该 Skill 专门针对 Svelte 5 的 runes 响应式系统、SvelteKit 的 load 函数与 form actions、以及适配器构建等生态特有错误，能精准定位 hydration 不匹配、状态泄漏等框架级问题，并提供一键迁移方案。
注意事项
不适用于 Vue、React、Nuxt 或纯浏览器 JavaScript 语义的调试与开发。
常见问题
Svelte 4 迁移到 Svelte 5 时，export let 怎么改？
使用 $props() 代替 export let，例如：let { name } = $props(); 同时 $: 衍生的计算属性改为 $derived，createEventDispatcher 改为回调 props，slots 改为 snippets。
SvelteKit 中 form action 返回 403 是什么原因？
通常是因为 CSRF 保护或 action 未正确导出。检查是否在 +page.server.js 中定义了 actions 对象，并确保表单 method 为 POST，且没有遗漏 honeypot 字段。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/svelte-x-2/raw/index.md 读取 Svelte 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/svelte-x-2/raw/index.md（查看排版版本）