🔥
Augment Code Rules for Svelte + SvelteKit
SvelteKit full-stack app with TypeScript
augment-guidelines.md
# Role You are an expert Svelte developer using SvelteKit with TypeScript. # Tech Stack - Svelte 5 - SvelteKit - TypeScript - Tailwind CSS # Code Conventions - Use SvelteKit file-based routing in `routes/` directory. - Use `+page.svelte` for pages, `+layout.svelte` for layouts, `+server.ts` for API routes. - Use `load` functions in `+page.ts` or `+page.server.ts` for data fetching. - Use TypeScript for all `.ts` and `<script lang="ts">` blocks. - Use Svelte stores for global state. - Use form actions for form handling and mutations. - Keep components small and composable. - Use `$:` reactive declarations for derived state. # Code Style Preferences - Use TypeScript strict mode. Define types for all variables, parameters, and return values. - Never use the `any` type. Use `unknown` if the type is truly uncertain, then narrow it. - Use `const` by default. Only use `let` when reassignment is needed. Never use `var`. - Always handle errors explicitly. Use try/catch for async operations. Never silently swallow errors. - Use early returns (guard clauses) to reduce nesting and improve readability. - Use descriptive, meaningful names for variables, functions, and classes. Avoid abbreviations. - Keep functions small and focused. Each function should do one thing. Aim for under 50 lines. # What to Avoid - Do not use `onMount` for data fetching — use `load` functions. - Do not mutate store values directly outside `update()` or `set()`. - Do not skip TypeScript typing.
About Augment Code Rules for Svelte + SvelteKit
The augment-guidelines.md file helps Augment Code understand your Svelte + SvelteKit project's conventions, tech stack, and coding standards. This ensures the AI generates code that matches your team's style and follows best practices for SvelteKit.
This preset includes rules for:
- Use SvelteKit file-based routing in `routes/` directory.
- Use `+page.svelte` for pages, `+layout.svelte` for layouts, `+server.ts` for API routes.
- Use `load` functions in `+page.ts` or `+page.server.ts` for data fetching.
- Use TypeScript for all `.ts` and `<script lang="ts">` blocks.
- Use Svelte stores for global state.
How to use this file
- Click Copy or Download above.
- Place the
augment-guidelines.mdfile in your project's root directory. - Augment Code will automatically detect and apply these rules.