playbooks

home / skills / bankkroll / skills-builder / sveltekit

sveltekit skill

/skills/sveltekit

This skill provides comprehensive SvelteKit documentation guidance for cli, routing, adapters, and builds to answer questions quickly.

npx playbooks add skill bankkroll/skills-builder --skill sveltekit

Review the files below or copy the command above to add this skill to your agents.

Files (26)
SKILL.md
4.1 KB
---
name: "sveltekit"
description: "Scraped from https://kit.svelte.dev/docs/ Source: https://kit.svelte.dev/docs. Use when questions involve: cli, kit, svelte."
---

# Sveltekit

> Official documentation: https://kit.svelte.dev/docs

## Overview

This skill provides comprehensive documentation for sveltekit.

**Total references:** 25 files (~169,440 tokens)

**Topics covered:**
dev, Adding community adapters, Netlify Edge Functions, Navigation, pushState, build, error, Matching, Sorting, Rest parameters, opentelemetryapi, Reducing code size...

## Reference Files

Load only the reference files relevant to the user's question:

### Cli

- **[Not found! and more](references/cli.md)** (~92 tokens)

### General

- **[$app/environment and more](references/general-1.md)** (~7,641 tokens)
  - Topics: browser, building, dev
- **[@sveltejs/kit/hooks](references/general-2.md)** (~10,250 tokens)
  - Topics: sequence
- **[@sveltejs/kit/vite](references/general-3.md)** (~57 tokens)
  - Topics: sveltekit
- **[@sveltejs/kit](references/general-4.md)** (~14,280 tokens)
  - Topics: Server, VERSION, error
- **[Accessibility and more](references/general-5.md)** (~5,954 tokens)
  - Topics: Route announcements, Focus management, The lang attribute
- **[Node servers and more](references/general-6.md)** (~7,351 tokens)
  - Topics: Usage, Deploying, Environment variables
- **[Advanced routing and more](references/general-7.md)** (~3,694 tokens)
  - Topics: Rest parameters, Optional parameters, Matching
- **[Configuration and more](references/general-8.md)** (~7,620 tokens)
  - Topics: Config, KitConfig, adapter
- **[Frequently asked questions](references/general-9.md)** (~3,768 tokens)
  - Topics: Other resources, What can I make with SvelteKit, How do I include details from packagejson in my application
- **[Form actions](references/general-10.md)** (~9,804 tokens)
  - Topics: Default actions, Named actions, Anatomy of an action
- **[Glossary](references/general-11.md)** (~1,392 tokens)
  - Topics: CSR, Edge, Hybrid app
- **[Hooks](references/general-12.md)** (~8,143 tokens)
  - Topics: Server hooks, Shared hooks, Universal hooks
- **[Images and more](references/general-13.md)** (~3,970 tokens)
  - Topics: Vites built-in handling, sveltejsenhanced-img, Loading images dynamically from a CDN
- **[Loading data](references/general-14.md)** (~16,277 tokens)
  - Topics: Page data, Layout data, pagedata
- **[Not found! and more](references/general-15.md)** (~7,820 tokens)
  - Topics: redirect and error are no longer thrown by you, path is required when setting cookies, Top-level promises are no longer awaited
- **[Page options and more](references/general-16.md)** (~7,208 tokens)
  - Topics: prerender, entries, ssr
- **[Remote functions](references/general-17.md)** (~14,059 tokens)
  - Topics: Overview, query, querybatch
- **[Routing](references/general-18.md)** (~7,797 tokens)
  - Topics: page, error, layout
- **[SEO and more](references/general-19.md)** (~6,936 tokens)
  - Topics: Out of the box, Manual setup, Private environment variables
- **[Shallow routing and more](references/general-20.md)** (~2,052 tokens)
  - Topics: API, Loading data for a route, Caveats
- **[@sveltejs/kit](references/general-21.md)** (~14,280 tokens)
  - Topics: Server, VERSION, error
- **[Web standards](references/general-22.md)** (~3,430 tokens)
  - Topics: Fetch APIs, FormData, Stream APIs

### Kit

- **[Not found! and more](references/kit.md)** (~5,380 tokens)

### Svelte

- **[Not found! and more](references/svelte.md)** (~185 tokens)

## Usage Guidelines

1. **Identify relevant sections** - Match the user's question to the appropriate reference file(s)
2. **Load minimally** - Only read files directly relevant to the question to conserve context
3. **Cite sources** - Reference specific sections when answering
4. **Combine knowledge** - For complex questions, you may need multiple reference files

### When to use each reference:

- **Cli**: Cli-related features and documentation
- **General**: General documentation, overview, and getting started
- **Kit**: Kit-related features and documentation
- **Svelte**: Svelte-related features and documentation

Overview

This skill provides concise, practical documentation and guidance for using SvelteKit — the application framework for building web apps with Svelte. It covers CLI usage, routing, data loading, hooks, configuration, deployment adapters, and best practices. The content is organized to help developers find answers quickly for dev, build, and deployment workflows.

How this skill works

The skill inspects SvelteKit concepts and common workflows and returns focused answers sourced from the official docs. It maps user questions to relevant topics like routing, page/load functions, form actions, prerendering, and adapters, then synthesizes clear steps, code patterns, and configuration examples. When necessary it combines multiple reference areas (routing, hooks, adapters) to produce practical, actionable guidance.

When to use it

  • You need concise instructions for SvelteKit CLI commands, builds, or dev-server usage.
  • You want routing, layout, or load/page data patterns and examples.
  • You need guidance on adapters, deployment targets (Node, static, Edge), or prerendering.
  • You are debugging hooks, session handling, or server-side behavior.
  • You want to implement form actions, progressive enhancement, or streaming responses.

Best practices

  • Keep load functions small and return only the data the page needs; avoid leaking server-only values to the client.
  • Use named form actions for progressive enhancement and fall back to standard form POSTs for non-JS users.
  • Choose the adapter that matches your deployment target and test both dev and production builds locally.
  • Prefer layout and nested routes to share data and minimize duplicate fetching.
  • Use environment variables for secrets and mark private vars properly so they’re not exposed to the client.

Example use cases

  • Set up a new SvelteKit project, run the dev server, and build for production with the correct adapter.
  • Implement nested layouts and load shared data in a root layout while fetching route-specific data in pages.
  • Create server-only endpoints and use hooks to add authentication or custom headers across requests.
  • Configure prerendering for static pages while keeping dynamic routes server-rendered.
  • Handle form submissions with named actions and return validation errors to the page without a full SPA client.

FAQ

How do I choose an adapter?

Pick the adapter that matches your hosting platform (e.g., Node, Vercel, Netlify, Cloudflare) and test the production build locally to validate behavior.

Where should I put authentication logic?

Use hooks for per-request auth (handle) and server routes or endpoints for login/logout actions; avoid exposing secrets to client code.

When should I prerender pages?

Prerender static content or marketing pages for performance; keep dynamic, user-specific, or frequently-updated pages server-rendered or use incremental strategies.