Perfect Svelte 5 code completion for any LLM - Claude, ChatGPT and GitHub Copilot

00:00:00 Introduction to AI and Svelte 5
00:02:13 Using Context to Solve LLM Problems
00:05:52 Introducing svelte-llm
00:11:50 Demonstrating Svelte Map and Error Boundaries
00:14:02 Building a Tic-Tac-Toe Game with Runes

Learn how to make AI assistants write modern Svelte 5 and SvelteKit code, even though they haven't been specifically trained on it. We solve common issues like outdated syntax and mixed Svelte versions by preloading documentation context.

We'll build everything from basic components to a complete Tic-Tac-Toe game using runes and TypeScript, showing how to get consistent, modern code from any AI assistant. The approach works across different LLMs and helps bridge the gap between AI training cutoff dates and the latest framework features.

#svelte #sveltekit #webdev #ai

[StanislavKhromov]

🎉 Svelte now has an official llms.txt file! The /llms-small.txt version has the same content and size as the "recommended" preset used in this video, and you can use it instead of the svelte-llm site!

More info:

Thanks for the video. I just wanted to say that Claude (3.5 haiku) knows a lot about svelte 5 without any additional context. However, I tried this with Aider and Llama3.1 405b and it worked great. The only thing Llama didn't get right at the start was replacing on:click with onclick, but he was able to fix it when I requested it.

[tedspens]

Thank you for making this resource available. Bookmarked! It's frustrating that gpt is not up to date, especially in dealing with web dev technologies. I can't wait try out the Svelte and SvelteKit bundle. Also just found your channel. A friend of Svelte is a friend of mine. Subscribed 👍

[saraili]

Awesome. I waited for a year for such combo of Svelte and LLM

[SlashandDevOps]

Great video. This is exactly what I need. I was minifying my code but claude was always pulling in old syntax.

[kirso]

Amazing stuff! Also love your videos Stanislav!

[trueadm]

It didn't quite get error boundaries right. Errors thrown in event handlers are not caught by boundaries, so you were just seeing the error thrown in the console.

[mostafamohsen]

U r the best in svelte Bro
I love svelte because of u❤

[zsmain]

That will be very beneficial, thank you so much

[MikeEvans-ck]

Thank you for this.
Opened my eyes to new ways to make code generation better.

Weirdly, using your files in a Perplexity Space and trying to duplicate the 'tic tac toe' exercise - I kept getting code like:
let board = state<Array<('X' | 'O' | null)[]>>
And when I queried this, the LLM was very stubborn:
"You do not prefix the rune with a $. The $ prefix is from older Svelte syntax (for auto-subscriptions to stores), but with Svelte 5 runes, you simply use the rune name directly as a function-like keyword"
and cited your llms files (I tried big and medium sizes).
Ah well, it's a developing field...

[KevinMacKenzie]

Thank you. I was hoping you'd update for Svelte 5.

[suvrotica]

This was very helpful. Can you upload tailwind 4 the new versions documentation

[justingolden]

Awesome vid! Can you link the svelte/svelte kit/typescript prompt about 11mins in?

[yash]

btw this works amazinglyyyy
but token usage is

[lasarkolja]

(How) can you set such custom instructions in cursor?
BTW, great idea, thanks for that and the video 👍

[carlosdesantiago]

I used the brave search MCP to give claude access to the web, told it to read svelte 5 docs and have been pair coding with that.
Would my approach fall under RAG? Do you think the approach you highlight in this video would be better than what I am doing now?

[SinisterSpatula]

I am hoping some day soon we can just have an llm agent that is a master of svelte 5 that assists the main model or something like that. Like mixture of experts.

[KeesFluitman]

I tried it in open web ui, using my locally ran ollama. With custom models in the workspace. But it just seems to ignore the docs and gives old answers. I dont have a claude subscription so i cant test the projects feature. Ill test claude for a month and see :)

[vishwarocks]

Please show us demo, how to use on github copilot / cursor

[SRVblueshero]

Is the llms.txt file enough to update the llm? Or do you need to provide additional examples? And how accurate is the llm in the end (i.e. does it still generate code that uses previous versions of Svelte)?