@vite-pwa/astro

Zero-config PWA Integration for Astro

Features

• Documentation & guides
• Zero-Config: sensible built-in default configs for common use cases
• Extensible: expose the full ability to customize the behavior of the plugin
• Type Strong: written in TypeScript
• Offline Support: generate service worker with offline support (via Workbox)
• Fully tree shakable: auto inject Web App Manifest
• Prompt for new content: built-in support for Vanilla JavaScript, Vue 3, React, Svelte, SolidJS and Preact
• Stale-while-revalidate: automatic reload when new content is available
• Static assets handling: configure static assets for offline support
• Development Support: debug your custom service worker logic as you develop your application
• Versatile: integration with meta frameworks: îles, SvelteKit, VitePress, Astro, Nuxt 3 and Remix
• PWA Assets Generator: generate all the PWA assets from a single command and a single source image
• PWA Assets Integration: serving, generating and injecting PWA Assets on the fly in your application

Install

From v0.2.0, @vite-pwa/astro requires Vite 5 and Astro 4.0.0 or above.

Using any version older than v0.2.0 requires Vite 3.1.0+.

npm i @vite-pwa/astro -D

# yarn
yarn add @vite-pwa/astro -D

# pnpm
pnpm add @vite-pwa/astro -D

Usage

Add @vite-pwa/astro integration to astro.config.mjs and configure it:

// astro.config.mjs
import AstroPWA from '@vite-pwa/astro'
import { defineConfig } from 'astro/config'

// https://astro.build/config
export default defineConfig({
  integrations: [AstroPWA()]
})

Read the documentation for a complete guide on how to configure and use this plugin.

️ Examples

You need to stop the dev server once started and then run npm run build && npm run preview to see the PWA in action.

Example	Source	Playground
Auto Update PWA	GitHub
Prompt for Update PWA	GitHub

Full config

Check out the following links for more details:

• Web app manifests
• Workbox

License

MIT License 2022-PRESENT Anthony Fu