# Sveltekit Tailwind Typescript Guide Svelte State Management

> Use when working with SvelteKit — state management, stores, reactive declarations

- Skill: `liaosw97/sveltekit-tailwind-typescript-guide-svelte-state-management` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add liaosw97/sveltekit-tailwind-typescript-guide-svelte-state-management`
- Raw SKILL.md: https://api.skillmd.com/api/skills/liaosw97/sveltekit-tailwind-typescript-guide-svelte-state-management/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: liaosw97 (https://skillmd.com/u/liaosw97)
- Updated: 2026-09-22
- Page: https://skillmd.com/skills/liaosw97/sveltekit-tailwind-typescript-guide-svelte-state-management

---


- 使用 Svelte stores 进行全局状态管理：
    typescript
    import { writable } from 'svelte/store';
    export const myStore = writable(initialValue);
    
  - 在组件中使用 `$` 前缀访问 store 的值：
    svelte
    <p>{$myStore}</p>
    
- 响应性
  - 对派生值使用响应式声明：
    svelte
    $: derivedValue = someValue * 2;
    
  - 对副作用使用响应式语句：
    svelte
    $: {
      console.log(someValue);
      updateSomething(someValue);
    }