SuperAPI AI 工具集

sveltekit

前端与建站

查看项目

更新于 10-15 21:49

技能介绍

用途:SvelteKit 是 Svelte 的元框架,类似 React 的 Next.js,使用标准 Web API,提供路由、服务端渲染与 API 端点。该技能用于开发全栈 Svelte 应用,统一前后端,并可通过适配器部署到 Vercel、Cloudflare、Netlify、Node 等平台。

主要能力:基于 src/routes 的文件路由;+page.server.js 中的 load 函数在页面渲染前取数据并在组件中自动获得类型;在 +page.server.js 导出的具名 actions 处理表单提交;适配器作为部署目标插件,如 adapter-auto、adapter-node、adapter-cloudflare。

使用方式:路由页面以 +page.svelte 命名;数据加载写在 +page.server.js 的 load 中,用 $props() 接收;表单用 actions 处理,可配合 use:enhance 渐进增强,失败时用 fail(400,{...}),成功跳转用 redirect(303,'/dashboard')。

适用场景:全栈 Svelte 应用、统一后端与前端、边缘部署。

限制与最佳实践:建议用 Svelte 5 Runes;用 App.State 管理类型安全的全局状态;load 中返回 promise 可流式传输非关键数据;不要用 store 传服务端数据,应使用 page.data;敏感数据库查询或密钥查找必须放在 +page.server.ts 而非面向客户端的 +page.ts。常见问题:SSR 报 500 模块加载错误多因客户端库被直接引入 SSR,可在 onMount() 动态导入或用 $app/environment 判断浏览器;路由 404 常因命名缺少前缀加号;适配器未指定需在 svelte.config.js 中安装配置适配器。部分细节(如具体定价、平台支持范围)暂未提供。