Skip to content

Commit 275bd61

Browse files
authored
docs: service worker types (#8965)
The additional reference is needed for $service-worker to be properly typed
1 parent 3aedafa commit 275bd61

File tree

1 file changed

+4
-1
lines changed

1 file changed

+4
-1
lines changed

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

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ The following example caches the built app and any files in `static` eagerly, an
2424

2525
```js
2626
// @errors: 2339
27+
/// <reference types="@sveltejs/kit" />
2728
import { build, files, version } from '$service-worker';
2829

2930
// Create a unique cache name for this deployment
@@ -108,21 +109,23 @@ navigator.serviceWorker.register('/service-worker.js', {
108109
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:
109110

110111
```original-js
112+
/// <reference types="@sveltejs/kit" />
111113
/// <reference no-default-lib="true"/>
112114
/// <reference lib="esnext" />
113115
/// <reference lib="webworker" />
114116
115117
const sw = /** @type {ServiceWorkerGlobalScope} */ (/** @type {unknown} */ (self));
116118
```
117119
```generated-ts
120+
/// <reference types="@sveltejs/kit" />
118121
/// <reference no-default-lib="true"/>
119122
/// <reference lib="esnext" />
120123
/// <reference lib="webworker" />
121124
122125
const sw = self as unknown as ServiceWorkerGlobalScope;
123126
```
124127

125-
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 the easiest that requires no additional files). Use `sw` instead of `self` in the rest of the file.
128+
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 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.
126129

127130
## Other solutions
128131

0 commit comments

Comments
 (0)