Skip to content

Commit 16a85b3

Browse files
committed
actually i guess this section was moved above? removing
1 parent e9ecea5 commit 16a85b3

File tree

1 file changed

+2
-16
lines changed

1 file changed

+2
-16
lines changed

documentation/docs/30-advanced/40-service-workers.md

Lines changed: 2 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,10 @@ The following example caches the built app and any files in `static` eagerly, an
2929
/// <reference no-default-lib="true"/>
3030
/// <reference lib="esnext" />
3131
/// <reference lib="webworker" />
32+
3233
// Ensures that the `$service-worker` import has proper type definitions
3334
/// <reference types="@sveltejs/kit" />
35+
3436
// Only necessary if you have an import from `$env/static/public`
3537
/// <reference types="../.svelte-kit/ambient.d.ts" />
3638

@@ -135,22 +137,6 @@ navigator.serviceWorker.register('/service-worker.js', {
135137

136138
> [!NOTE] `build` and `prerendered` are empty arrays during development
137139
138-
## Type safety
139-
140-
Setting up proper types for service workers requires some manual setup. Inside your `service-worker.js`, add the following to the top of your file:
141-
142-
```js
143-
/// file: src/service-worker.js
144-
/// <reference types="@sveltejs/kit" />
145-
/// <reference no-default-lib="true"/>
146-
/// <reference lib="esnext" />
147-
/// <reference lib="webworker" />
148-
149-
const sw = /** @type {ServiceWorkerGlobalScope} */ (/** @type {unknown} */ (self));
150-
```
151-
152-
This disables access to DOM typings like `HTMLElement` which are not available inside a service worker and instantiates the correct globals. The reassignment of `self` to `sw` allows you to type cast it in the process (there are a couple of ways to do this, but this is the easiest that requires no additional files). Use `sw` instead of `self` in the rest of the file. The reference to the SvelteKit types ensures that the `$service-worker` import has proper type definitions. If you import `$env/static/public` you either have to `// @ts-ignore` the import or add `/// <reference types="../.svelte-kit/ambient.d.ts" />` to the reference types.
153-
154140
## Other solutions
155141

156142
SvelteKit's service worker implementation is designed to be easy to work with and is probably a good solution for most users. However, outside of SvelteKit, many PWA applications leverage the [Workbox](https://web.dev/learn/pwa/workbox) library. If you're used to using Workbox you may prefer [Vite PWA plugin](https://vite-pwa-org.netlify.app/frameworks/sveltekit.html).

0 commit comments

Comments
 (0)