SuperAPI AI 工具集

svelte-skills

前端与建站

查看项目

更新于 10-16 01:19

技能介绍

用途:本技能用于建立 Svelte 框架开发的完整技能体系,涵盖组件开发、响应式状态、模板控制流、DOM 交互、样式管理、状态共享、测试部署。当需要开发 Svelte 应用或学习 Svelte 框架时触发。

主要能力分为若干模块:入门部分含 svelte-core(项目创建、文件结构、Rune 概念)与 svelte-runes($state、$derived、$effect、$props);模板部分含 svelte-template-basics(标记语法、文本插值、特殊标签)与 svelte-control-flow(if、each、await、snippet);交互部分为 svelte-directives(bind、use、transition、animate);样式部分为 svelte-styling(作用域样式、CSS 自定义属性);高级部分含 svelte-special-elements(svelte:window、element、head)、svelte-state-management(Stores、Context API)、svelte-lifecycle(挂载、销毁、命令式 API);工程部分含 svelte-best-practices(测试、TypeScript、迁移指南)与 svelte-api-reference(svelte/* 模块文档);兼容部分为 svelte-legacy(Svelte 4 兼容代码维护)。

使用方式:按学习路径逐步推进。入门路线依次为 svelte-core、svelte-runes、svelte-template-basics、svelte-control-flow、svelte-directives;进阶路线为 svelte-styling、svelte-special-elements、svelte-state-management、svelte-lifecycle;专业路线为 svelte-best-practices、svelte-api-reference、svelte-legacy。

适用场景:现代 Web 应用开发中掌握 Svelte 各层能力,从基础概念到工程实践与遗留代码维护。

限制与注意:推荐使用 SvelteKit 作为应用框架,优先使用 Svelte 5 Runes 语法,新项目避免使用遗留语法,并遵循最佳实践编写高质量代码。资源索引包含官方文档 https://svelte.dev/docs、官方教程 https://svelte.dev/tutorial、Playground https://svelte.dev/playground、SvelteKit https://kit.svelte.dev。资料未提供具体安装命令、收费信息与实际效果说明。