Generate production-ready Svelte Cursor rules for Project Rules (.mdc), AGENTS.md, or legacy .cursorrules. This template encodes stack-specific conventions for projects using Svelte. Compile-time framework that converts declarative components into lean JavaScript.
The template focuses Cursor AI on concrete Svelte practices instead of generic coding advice. Required sections are always included; optional sections can be enabled when they match your project.
Optional sections: Routing (SvelteKit).
The generator turns these sections into Project Rules with frontmatter, AGENTS.md, or a single .cursorrules file depending on the output format you choose.
- Use Svelte 5 runes ($state, $derived, $effect) for reactivity.
- Keep script, template, and style sections in each .svelte file.
- Use 2 spaces for indentation.
- Use camelCase for variable and function names.
- Keep components focused on a single responsibility.
- Extract reusable logic into .svelte.js modules.- Use $state() for reactive local state.
- Use $derived() for computed values — no manual invalidation.
- Use $effect() for side effects with automatic cleanup.
- Use $props() for component props with destructuring.
- Use $bindable() for two-way bindable props.
- Avoid overusing stores — prefer runes for local state.- Use scoped <style> blocks in .svelte files.
- Use CSS custom properties for theme values.
- Use :global() modifier sparingly and only when necessary.
- Use class:directive for conditional classes.
- Prefer Tailwind CSS for utility-first styling when using SvelteKit.
- Keep styles co-located with components.