SvelteKit + Ionic 6 has landed!

Hi there,

I completed the migration of the Ionic-Svelte project into Ionic SvelteKit.

I am pretty happy with the results and learnings - SvelteKit is really something else if you are only used to SPA development (like me). But nevertheless good to know its architecture moving forward into hypercharged app development - through so-called meta-frameworks.

So - if you want to see the project, go to the repo - GitHub - Tommertom/svelte-ionic-app: Ionic UI showcase app - try Ionic UI and directly go to API or source code (Svelte, Angular, Vue, Vanilla and React)

Or the demo app showcasing all UI elements- ionicsvelte.firebaseapp.com

If you want to learn Svelte, I recommend first learning Svelte syntax on svelte.dev. Then going into kit.svelte.dev for in-depth views on the meta-framework. And bear in mind - because you can only use SPA elements for Ionic, most (all?) server side concepts are not relevant.

If you are interested in a Svelte supercharged Ionic app - visit https://ionicsvelte.firebaseapp.com/

This PWA showcases all Ionic Elements (up to Ionic 6.1) in one go - and if you visit this with different devices, you will be able to see the responsiveness and coolness of Ionic.

Which you all already know of course!

The README shows some of the migration steps and things to keep in mind when going into SvelteKit. Most notably - SSR won’t work with Ionic.

Looking forward to feedback!

3 Likes

Congrats on completion! This would surely come in handy. Thank you for your contribution to the Ionic community!

2 Likes

Hi tommertom…

i would like to know about svelte and ion-router. Do you have the documentation about it? Or is it for ion router you are using Sveltekit for router?

Hi

I recommend using the Kit router. The ion-router would not work well with Kit. Maybe with svelte without kit to some extend, but what i have tried in the past, it is not ideal.

Tom

thanks for the reply, i appreciate it…