Service Worker

[tw1t611]

Is your feature request related to a problem? Please describe.
Adding a service worker is not intuitive at the moment.
I found this: https://www.npmjs.com/package/kit-sw-workbox,
but as far as I remember, adding a service worker on polymer and gatsby was pretty clean and simple out of the box.

Describe the solution you'd like
I'd like a default service worker automatically generated at build time, if no src/service-worker.js/ts exists.
The service worker should be disabled in dev environment.

How important is this feature to you?
I think it is a rather basic feature for static code generators, but not urgent by any means.

Additional context
You already built helpers for implementing a service worker. So, do you already plan this?
https://kit.svelte.dev/docs#modules-service-worker

This vite plugin could also be a solution, if it works with svelte-kit.
https://github.com/antfu/vite-plugin-pwa

[dummdidumm]

Please provide more details on what you found unintuitive. The reason why this wasn't added yet is because the needs for a service worker setup differ greatly between apps. Sapper did have a default service worker and it caused many people headaches.

[tw1t611]

In case of using kit-sw-workbox, I would find it unintuitive to manually add routes and alter layout/page files to handle service worker events.

I didn't know service worker was a problem on sapper and I am not an expert on this field. Maybe you could give some more information about that.
Therefor I would like to have a solution that just works and I think most developers don't want/ shouldn't need to dig deep into all the aspects of service workers, if they don't need something special.

As far as I understand I want an always offline first service worker, that caches all static assets.
If using adapter-static that could be the whole page.

A guide/entry in the docs on how to setup a "default" service worker might be sufficient.
Of course I don't want you to implement something that does not work, or doesn't make sense.
All I know is that other frameworks got a solution, even if its not the right solution for everyone.

What would be the recommended way to implement service workers using https://kit.svelte.dev/docs#modules-service-worker ?
Maybe thats all I need and I just don't know it.

[ekafyi]

You can create src/service-worker.js (or .ts), SvelteKit will build and inject it automatically. SvelteKit's modules return paths to built assets so you can cache them. You can write your service worker code like you would in any other stack/framework (or even in static HTML+JS files).

This is a simple example where I use Workbox's precacheAndRoute: https://twitter.com/ekafyi/status/1409555938214703107

Alternatively, you can use this plugin https://github.com/antfu/vite-plugin-pwa to define everything from svelte config, ie. not write your own service worker code.

[Mlocik97]

for now You can just copy:

https://gist.github.com/Mlocik97/cf0f4c39e46d45404fda8808a25244c8 (based on Sapper's sw)

to src/service-worker.js

[tw1t611]

@Mlocik97 Ty for the script. I'll take it for now, until there is an official solution. Works fine though. ;)