https://github.com/pnsk-lab/vite-sw

A plugin for writing Service Worker on Vite
https://github.com/pnsk-lab/vite-sw

service-worker vite

Last synced: 2 months ago
JSON representation

A plugin for writing Service Worker on Vite

• Host: GitHub
• URL: https://github.com/pnsk-lab/vite-sw
• Owner: pnsk-lab
• Created: 2024-06-28T08:50:03.000Z (8 months ago)
• Default Branch: main
• Last Pushed: 2024-06-28T10:39:00.000Z (8 months ago)
• Last Synced: 2024-06-29T11:27:37.702Z (8 months ago)
• Topics: service-worker, vite
• Language: TypeScript
• Homepage: https://www.npmjs.com/vite-sw
• Size: 18.6 KB
• Stars: 4
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# vite-sw

vite-sw is a plugin for writing Service Worker on Vite.

### Setting up

To install:

```shell

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`:

```ts

import { defineConfig } from 'vite'

import { pluginSW } from './lib'

export default defineConfig({

  plugins: [pluginSW()],

})

```

Add types to `vite-env.d.ts`:

```ts

// ...

/// 

// ...

```

## Usage

```ts

// src/sw.ts

/// 

declare const self: ServiceWorkerGlobalScope

self.addEventListener('fetch', () => {

  // Write code here

})

self.addEventListener('install', () => {

  self.skipWaiting()

})

```

And import it:

```ts

import regester from './sw?sw'

const regestered: ServiceWorkerRegistration = await regester({

  scope: '/'

})

```