sveltekit-typescript-guide-cursorrules-prompt-file — Cursor rule
A Cursor rule that points the agent at Svelte 5, SvelteKit and TypeScript: project structure, runes, state handling.
.cursor/rules/sveltekit-typescript-guide-cursorrules-prompt-file.mdcWhat sveltekit-typescript-guide-cursorrules-prompt-file does
The file sets a role: inside Cursor the agent treats itself as an expert in Svelte 5, SvelteKit, TypeScript, Supabase and Drizzle. It then lists the areas where it keeps your code in line — naming conventions, type usage, Svelte runes, SvelteKit project structure, component development, state management, styling and Shadcn colour conventions.
One section covers complex state. The example is a class in counter.svelte.ts: fields declared with $state, methods that increment and reset. A single instance is created and exported, and that is the shape the agent will reach for when your state starts behaving like a state machine.
The rule lives at .cursor/rules/sveltekit-typescript-guide-cursorrules-prompt-file.mdc. Its frontmatter carries alwaysApply: false, so it does not ride along with every request — worth checking whether Cursor picks it up through the **/* globs or you have to attach the file to the chat yourself.
What it helps with
- keep one code style across a SvelteKit project
- write state with Svelte 5 runes instead of older stores
- move state machine logic into a class with methods
- follow SvelteKit directory structure
- keep Supabase and Drizzle usage consistent in one project
Example prompts for the agent
- Build a counter component in Svelte 5 using runes for state
- Refactor this component to match the SvelteKit project structure
- Move this store logic into a class with methods
How to install sveltekit-typescript-guide-cursorrules-prompt-file
Manually: put the files in place
.cursor/rules/sveltekit-typescript-guide-cursorrules-prompt-file.mdcFrontmatter: description, globs, alwaysApply
Manually: put the files in place
.claude/rules/sveltekit-typescript-guide-cursorrules-prompt-file.mdThe paths frontmatter field limits the files: move globs from the source into paths
AGENTS.md
Codex reads AGENTS.md: paste the rule text there
Manually: put the files in place
.github/instructions/sveltekit-typescript-guide-cursorrules-prompt-file.instructions.mdThe applyTo field sets which files it applies to: move globs from the source into applyTo
Manually: put the files in place
.devin/rules/sveltekit-typescript-guide-cursorrules-prompt-file.mdManually: put the files in place
.clinerules/sveltekit-typescript-guide-cursorrules-prompt-file.mdStep by step, with commands for each platform: Cursor rules: .mdc files, four modes and what replaced .cursorrules
Questions about sveltekit-typescript-guide-cursorrules-prompt-file
How do I install sveltekit-typescript-guide-cursorrules-prompt-file in Cursor?
Create .cursor/rules/sveltekit-typescript-guide-cursorrules-prompt-file.mdc and paste the rule contents into it.
What does this rule do?
It primes the Cursor agent for Svelte 5, SvelteKit and TypeScript: code style, naming, runes, project structure and state management.
Does the rule apply to every file automatically?
The frontmatter sets alwaysApply: false with **/* globs. Check whether Cursor matches it by glob, or attach the file to the chat manually.
Source text
sveltekit-typescript-guide-cursorrules-prompt-file.mdc · CC0-1.0
---
description: "Cursor rules for SvelteKit development with TypeScript integration."
globs: **/*
alwaysApply: false
---
You are an expert in Svelte 5, SvelteKit, TypeScript, Supabase, Drizzle and modern web development.
Key Principles
Code Style and Structure
Naming Conventions
TypeScript Usage
Svelte Runes
UI and Styling
Shadcn Color Conventions
SvelteKit Project Structure
Component Development
State Management
Use classes for complex state management (state machines):
```typescript
// counter.svelte.ts
class Counter {
count = $state(0);
incrementor = $state(1);
increment() {
this.count += this.incrementor;
}
resetCount() {
this.count = 0;
}
resetIncrementor() {
this.incrementor = 1;
}
}
export const counter = new Counter();
© PatrickJS · CC0-1.0 · PatrickJS/awesome-cursorrules
