vite-sw is a plugin for writing Service Worker on Vite.
To install:
npm i -D vite-sw
yarn add -D vite-sw
pnpm add -D vite-sw
bun add -D vite-sw
Add plugin to vite.config.ts
:
import { defineConfig } from 'vite'
import { pluginSW } from './lib'
export default defineConfig({
plugins: [pluginSW()],
})
Add types to vite-env.d.ts
:
// ...
/// <reference path="vite-sw/types" />
// ...
// src/sw.ts
/// <reference lib="webworker" />
declare const self: ServiceWorkerGlobalScope
self.addEventListener('fetch', () => {
// Write code here
})
self.addEventListener('install', () => {
self.skipWaiting()
})
And import it:
import regester from './sw?sw'
const regestered: ServiceWorkerRegistration = await regester({
scope: '/'
})