sveltekit

SvelteKit

优化路由和数据流，确保其在 SSR、水合、导航和渐进增强下始终正确。重点关注边界和最精简的正确实现。

范围

当难点在于应用级或路由级行为时，使用此技能。如果任务主要涉及组件内部、runes、片段、本地状态或样式，请使用 svelte 技能。

工作流

1. 修改代码前，先了解项目的本地风格。

   • 检查 package.json、svelte.config.*、路由树、钩子和附近的路由文件。
   • 除非任务明确要求迁移，否则优先遵循所修改文件中的现有约定。
   • 编写新代码时，默认使用当前的 SvelteKit API 和类型化路由文件。

2. 编写代码前，先确定服务端／客户端边界。

   • 将仅限服务端的工作放在 +page.server.*、+layout.server.*、+server.*、钩子或 $lib/server/* 中。
   • 将可复用的视图逻辑放在组件或 $lib 中，而不是路由文件中。
   • 不要将请求专属的可变状态放在共享模块中，以免服务端状态泄漏给其他用户。
   • 让路由流程一目了然：参数、URL、Cookie 和 locals -> load 或 action -> 类型化 props -> 组件。

3. 先解决数据流，再处理 UI 细节。

   • 决定真值应放在 URL、服务端数据、组件状态、快照、上下文还是共享响应式对象中。
   • 派生状态，而不是同步多份副本。
   • 确定数据是自动重新运行，还是仅在定向失效后重新运行。

4. 明确导航和 SSR 行为。

   • 检查代码是在服务端、浏览器中还是两者都会运行。
   • 决定状态是在重新加载、深层链接、历史导航后仍然保留，还是仅在当前渲染期间保留。
   • 检查路由组件是否会在导航时复用，以及是否需要显式重置任何内容。

5. 使用仓库现有的检查，验证相关的服务端、浏览器和渐进增强路径。

   • 如果行为与版本有关，请根据已安装的 Svelte 和 SvelteKit 版本以及当前官方文档进行核实。

主题指南

• 更改路由文件、load、父级数据、依赖跟踪或序列化时，请阅读 guides/load-routing.md。
• 实现表单、变更操作、渐进增强或 API 端点时，请阅读 guides/forms-endpoints.md。
• 处理钩子、身份验证、Cookie、密钥或请求级身份信息时，请阅读 guides/auth-cookies.md。
• 放置状态或更改导航、失效、历史记录或重置行为时，请阅读 guides/state-navigation.md。
• 涉及仅限浏览器的代码、服务端渲染、水合或水合前交互时，请阅读 guides/ssr-hydration.md。
• 使用重命名后的 API 或其他与版本相关的 SvelteKit 功能时，请阅读 guides/migration.md。