SvelteKit support

[yasserlens]

Hello!

This is one of the better designed UI component libraries out there so I'd love to use it in prod. However, I don't see explicit mentions of SvelteKit in the documentation and the installation guide mentions Sapper instead.
Is there SvelteKit support?
Are there examples of how to set it up correctly in a SvelteKit project?

Thank you

[illright]

Hi! Yeah :0

We haven't been at the project for a while, which is why the installation instructions talk about Sapper. The library is compatible with SvelteKit though (it's just Svelte components, after all), and the sveltekit:prefetch attributes are set along with sapper:prefetch. As for examples of how to set it up correctly — not much, the same steps apply as for Sapper, since most of the setup stuff is regarding Svelte preprocessors, which are SvelteKit-compatible.

Reach out if you encounter any issues during setup!

[yasserlens]

Thanks for that!
Re: setup - an under Rollup, it suggests having a rollup.config.js - the starting SvelteKit sample app doesn't have that file. Should this be added?

I'd like to give this component library a try but I want to make sure that unused components aren't included in the production build. I see that when I install the attractions package all components are installed under node_modules/attraction.s

Does svelte take care of not including unused modules behind the scenes using Rollup's default settings (since there is no explicit config setup)?

The final bundle size is important for us so I need to be certain that it stays at a minimum.

Thanks!

[illright]

it suggests having a rollup.config.js

It's not needed for SvelteKit, just the changes that you'd make in svelte.config.js

Does svelte take care of not including unused modules behind the scenes using Rollup's default settings (since there is no explicit config setup)?

I'd love to give you full peace of mind, but we haven't actually done full-blown bundle tests. What I do know, however, is that the library mostly contains svelte and scss files, all of which are to be fed into the compiler and there really is no point in shipping those over the wire. Personally, I trust the compiler to be smart enough not to include anything it doesn't need.

Also, Attractions is marked as tree-shakeable, if that makes you feel any more confident :) However, if you really need to make a case on tree-shakeability of Attractions (to your coworkers, for example), I'd suggest you to spin up a quick little Svelte project, import one component, check the weight of the build directory, add another import and check again. That's the most reliable way to be sure that you're not shipping anything excess

[yasserlens]

Makes sense - thank you. Measuring bundle size before after was on my todo list, was hoping for a straight answer instead of this though. It's an awesome library, but with limited support / unknown future it's hard to win the case of adopting it for prod. Especially that the team is new to Svelte, we don't want to deal with more unknowns :-)

Thanks for your quick turnaround!