Svelte 5RunesTypeScriptViteGitHub Copilot

Svelte 5 × GitHub Copilot Prompt Engineering

Stop fighting GitHub Copilot hallucinations. Generate Svelte 5-aware prompts that produce code your team can actually ship.

❌ Generic AI Output

// ❌ Generic GitHub Copilot output for Svelte 5
// Missing Svelte 5 conventions
// No error handling, no types
// Ignores Runes best practices
function getData() {
  // hallucinated API that doesn't exist
  return fetch('/api/data').then(r => r.json());
}

✅ Prompt Architect Output

// ✅ AI Prompt Architect output
// Full Svelte 5 conventions enforced
// Proper error handling & types
// Runes best practices included
// Production-ready, zero hallucinations

Real Generated Output

Automated Quality Enforcement

Every prompt includes strict bans and deprecation rules tailored to your Svelte 5 + Runes + TypeScript + Vite + GitHub Copilot stack

strict-bans.md — AI Prompt Architect

# ⛔ STRICT BANS — Enforced Constraints

## Framework Version Enforcement
- **BANNED**: React class components → Use functional components + hooks
- **BANNED**: `componentWillMount`, `componentWillUpdate` → Use `useEffect`
- **BANNED**: `getInitialState` → Use `useState` or `useReducer`
- **BANNED**: `createClass` syntax → Use arrow function components
- **BANNED**: PropTypes runtime validation → Use TypeScript interfaces
- **BANNED**: `defaultProps` static → Use ES6 default parameters

## TypeScript Enforcement
- **BANNED**: `any` type annotations → Use `unknown` + type guards
- **BANNED**: `@ts-ignore` comments → Fix the actual type error
- **BANNED**: Non-null assertions (`!`) → Use optional chaining (?.)
- **BANNED**: `enum` keyword → Use `as const` union types
- **BANNED**: `namespace` declarations → Use ES modules

## Security Constraints
- **BANNED**: `eval()`, `Function()` constructors
- **BANNED**: `innerHTML` assignments → Use `textContent` or sanitise
- **BANNED**: Hardcoded secrets, API keys, or credentials
- **BANNED**: `http://` URLs in production → Enforce `https://`
- **BANNED**: `*` CORS origins in production → Whitelist domains
- **BANNED**: SQL string concatenation → Use parameterised queries
- **BANNED**: `localStorage` for auth tokens → Use httpOnly cookies

## State Management
- **BANNED**: Prop drilling beyond 2 levels → Use Context or Zustand
- **BANNED**: `useEffect` for data fetching → Use React Query / SWR
- **BANNED**: Mutable state mutations → Use immutable update patterns
- **BANNED**: Global mutable variables → Use React state or stores

## API & Data Patterns
- **BANNED**: `fetch` without error handling → Wrap in try/catch
- **BANNED**: Untyped API responses → Define response interfaces
- **BANNED**: `console.log` in production → Use structured logger
- **BANNED**: Synchronous file I/O → Use async/await patterns
- **BANNED**: Unbounded `.find()` / `.filter()` on large arrays → Use Map/Set

## CSS & Styling
- **BANNED**: Inline styles for layout → Use CSS modules or Tailwind
- **BANNED**: `!important` overrides → Fix specificity properly
- **BANNED**: Fixed pixel breakpoints → Use relative units (rem/em)
- **BANNED**: `z-index` values > 100 → Use a z-index scale system

❌ The Problem

AI models hallucinate Svelte 5 runes syntax, confuse $state with stores, and produce Svelte 4 reactive declarations. Copilot's suggestions often ignore your codebase conventions and produce generic patterns.

✅ The Solution

AI Prompt Architect Prompts constrain to Svelte 5 runes — $state, $derived, $effect — with proper snippet boundaries and no legacy store imports. It generates Copilot-optimized prompts with inline comments and docstrings that guide suggestions.

Frequently Asked Questions

Does it work with GitHub Copilot?

Yes. AI Prompt Architect generates prompts optimised for GitHub Copilot, including context formatting and constraint syntax that GitHub Copilot responds best to.

Can it handle Svelte 5 projects?

Absolutely. Prompts include Svelte 5-specific conventions, API patterns, and best practices to eliminate common hallucinations.

Is there a free tier?

Yes — generate up to 5 prompts per day for free. Pro tier unlocks unlimited generations, team sharing, and advanced templates.

Technical Deep Dive

How does it handle the transition from Svelte stores to Svelte 5 runes?

The constraint engine enforces rune-only patterns ($state, $derived, $effect) and explicitly prevents legacy store imports. Prompts include migration hints for writable/readable store conversions.

Can prompts handle SvelteKit form actions and progressive enhancement?

Yes — prompts encode use:enhance directives, +page.server.ts action patterns, and proper fail() / redirect() usage. The system ensures forms work without JavaScript enabled.

How does AI Prompt Architect optimise prompts for GitHub Copilot?

It generates Copilot-optimised inline comments with explicit type annotations, function signatures, and JSDoc/docstring patterns that guide Copilot suggestions toward your project's conventions and architecture.

See the difference yourself

Stop wasting time fixing AI-generated Svelte 5 code. Start with the right prompt.

Try Svelte 5 + GitHub Copilot Prompts Free

Related Architectures

Explore more stack-specific prompt engineering guides

Svelte 5RunesTypeScript

Svelte 5 × GitHub Copilot Prompt Engineering

Automated Quality Enforcement

Frequently Asked Questions

Technical Deep Dive

See the difference yourself

Related Architectures

Svelte 5 × Cursor AI Prompt Engineering

Svelte 5 × Claude Prompt Engineering

Svelte 5 × Windsurf Prompt Engineering