Skip to content
vibespell

.cursor/rules/project.mdc

Cursor rules for SvelteKit

Cursor rules are a markdown file with a short frontmatter header. Cursor attaches them to the agent so it stops guessing how this repo builds, tests, and styles code. This copy is written for a SvelteKit project. This repository is a SvelteKit app. Load data in load functions, mutate through form actions, and write new components with Svelte 5 runes.

The example uses a balanced, readable style, pragmatic tests, and comments only where the intent is not obvious. Open the generator to make the agent stricter, switch to test-first, quiet the comments, or pick a different file.

The example assumes SvelteKit with Svelte 5 runes (`$state`, `$derived`, `$props`). It does not assume a database or an auth library. If the repo is still on Svelte 4 stores, follow the local style instead of rewriting it.

Customize in the generatorBrowse the library

Example file

Balanced strictness, readable style, pragmatic tests. Download name: project.mdc. Legacy path: .cursorrules

---
description: "Working rules for a SvelteKit repository"
globs: "**/*"
alwaysApply: true
---

# Project rules

Follow these rules on every task in this SvelteKit repository.
If the project still uses a root `.cursorrules` file, keep the same rules there.

## Stack

This repository is a SvelteKit app. Load data in load functions, mutate through form actions, and write new components with Svelte 5 runes.

## Layout

- Routes live in `src/routes/`. Shared UI lives in `src/lib/components/`.
- Server-only modules belong in `*.server.ts` files or under `$lib/server`.
- Keep `+page.svelte` focused on rendering. Data loading belongs in `+page.server.ts` or `+page.ts`.

## Commands

- Dev server: `npm run dev`
- Production build: `npm run build`
- Typecheck: `npm run check`
- Tests: `npm test`

Use the script the repo already defines when it differs from the command above.

## Conventions

- Load data in load functions. Do not fetch in `onMount` for data the server can load.
- Mutations go through form actions when the route already uses them.
- New components use Svelte 5 runes. Do not introduce a store for state a rune can hold.
- Use `$lib` imports for shared code. Relative imports that climb out of a route are a smell.
- Type the load function's data and the component's `$props`.
- Progressive enhancement matters. A form should still make sense without a custom click handler.

## Testing

Add or update tests when behavior changes.

Use the runner the repo already has. Test load functions and form actions as data, and add a browser test only for a real interaction.

## Style

- Optimize for the next reader over the shortest diff.
- Comment only when the why is non-obvious.
- Name things the way neighboring files already do.
- Do not reformat code you did not change.

## Errors

- Fail at the boundary. Do not swallow errors.
- Use SvelteKit's `error` and `fail` helpers so the page can render a useful message. Do not throw a bare string.

## Scope

- Do the requested task. Do not refactor unrelated code.
- Match the rigor already in the repo. Fix what you touch.
- Ask one clarifying question only when the task cannot be finished without it. Otherwise state the assumption and continue.

## Avoid

- Do not import `$lib/server` into client code.
- Do not put secrets in `$env/dynamic/public` or `$env/static/public`.
- Do not disable SSR for a route to paper over a window access bug.
- Do not rewrite a working Svelte 4 component into runes unless you are already editing it.

## Done when

- The requested behavior works.
- `npm run check` is clean for the files you touched, and the route still loads in `npm run dev`.
- The diff stays inside the task.
- You list anything you could not run.

Add it to the project

  1. 01

    Copy a starting file

    Copy the example Cursor rules on this page, or open the generator if you want different testing, strictness, or comment rules.

  2. 02

    Save it at .cursor/rules/project.mdc

    Save it at `.cursor/rules/project.mdc` in the SvelteKit repo and create the folders if they are missing. If the project still uses one root rules file, save the body as `.cursorrules`.

  3. 03

    Start a fresh agent session

    Rules files are read when a session starts. A chat that is already open may still be using the old instructions.

  4. 04

    Give it one small task

    Ask for one change a SvelteKit agent often gets wrong, such as a page whose data comes from a load function rather than onMount. If it ignores the file, confirm the path and start a new session.

Questions about this file

Where do I put Cursor rules in a SvelteKit repo?

Save it at `.cursor/rules/project.mdc` in the SvelteKit repo and create the folders if they are missing. If the project still uses one root rules file, save the body as `.cursorrules`.

Which tools read this Cursor rules?

Cursor reads `.cursor/rules/*.mdc` and, on older setups, a root `.cursorrules` file. Other tools ignore the frontmatter, so use AGENTS.md when more than one agent edits the repo.

What does the SvelteKit example assume?

The example assumes SvelteKit with Svelte 5 runes (`$state`, `$derived`, `$props`). It does not assume a database or an auth library. If the repo is still on Svelte 4 stores, follow the local style instead of rewriting it.

Does VibeSpell upload my repository?

No. Recipe pages are static, and the generator builds the file in your browser from the options you pick. Your source code never leaves the machine.

Other files for SvelteKit

Cursor rules for other stacks