BrowserUX Inject SW Assets
A simple and effective solution to ensure full offline support in your Vite + PWA applications.
BrowserUX Inject SW
Assets is a lightweight and smart Vite plugin designed to automatically inject
your static files (images, JSON, etc.) into your custom service worker. It perfectly
complements the injectManifest strategy from vite-plugin-pwa
by making sure all files not detected by Workbox are properly precached.
It provides a complete offline experience, with no complex configuration or
overlooked assets.
npm install vite-plugin-inject-sw-assets
Plugin for Vite
See the CHANGELOG
Key Features of BrowserUX Inject SW Assets
- 🔍 Scans the build output directory for static assets after each build
- 🖼️ Detects files by configurable extensions (default:
png,jpg,jpeg,svg,webp,ico,json) - 🔑 Computes an 8-character MD5 revision hash per file for Workbox cache invalidation
- 🧼 Auto-excludes PWA icons already listed in
manifest.webmanifest - 🚫 Supports custom glob exclusion patterns (
excludePatterns) - ⚙️ Writes a ready-to-import
sw-assets.jsdeclaringself.__INJECTED_ASSETS__/ - 📋 Output format is directly compatible with Workbox's
precacheAndRoute() - 🏗️ Build-only, never runs in development mode (
apply: 'build') - 🚀 Complements
vite-plugin-pwawith theinjectManifeststrategy - 🔌 Works with any Vite framework (React, Vue, Svelte, Astro…)