{"id":22829,"library":"vite-plugin-serwist","title":"vite-plugin-serwist","description":"Vite plugin for integrating Serwist (a Workbox-inspired service worker library) into your Vite application. Current stable version is 9.5.7, with 10.0.0-preview.14 available. Supports React, Vue, Svelte, Preact, SolidJS, and TypeScript. Unlike Workbox, Serwist offers modern ESM-first architecture, full TypeScript support, and plugin-specific configurations for various frameworks. Published under the serwistjs GitHub organization with monthly release cadence.","status":"active","version":"10.0.0-preview.14","language":"javascript","source_language":"en","source_url":"https://github.com/serwist/serwist","tags":["javascript","react","remix","vue","preact","svelte","sveltekit","solidjs","vite","typescript"],"install":[{"cmd":"npm install vite-plugin-serwist","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-serwist","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-serwist","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency for Vite plugin functionality","package":"vite","optional":false},{"reason":"Runtime dependency for type-safe window messaging","package":"@serwist/window","optional":true}],"imports":[{"note":"ESM-only; Node 20+. Plugin class default export.","wrong":"const SerwistPlugin = require('vite-plugin-serwist')","symbol":"SerwistPlugin","correct":"import { SerwistPlugin } from 'vite-plugin-serwist'"},{"note":"Named export, not default.","wrong":"import serwistPlugin from 'vite-plugin-serwist'","symbol":"SerwistPlugin as serwistPlugin"},{"note":"Type-only import to avoid runtime inclusion.","wrong":"import { InjectManifestOptions } from 'vite-plugin-serwist'","symbol":"type InjectManifestOptions","correct":"import type { InjectManifestOptions } from 'vite-plugin-serwist'"}],"quickstart":{"code":"import { SerwistPlugin } from 'vite-plugin-serwist';\nimport { defineConfig } from 'vite';\n\nexport default defineConfig({\n  plugins: [\n    SerwistPlugin({\n      swSrc: 'src/sw.ts',\n      swDest: 'dist/sw.js',\n      globDirectory: 'dist',\n      globPatterns: ['**/*.{html,js,css}'],\n      injectionPoint: 'self.__WB_MANIFEST',\n      maximumFileSizeToCacheInBytes: 5 * 1024 * 1024,\n      mode: 'production',\n    }),\n  ],\n});","lang":"typescript","description":"Configures SerwistPlugin with inject manifest mode, targeting a service worker source file and output."},"warnings":[{"fix":"Update injectionPoint to 'self.__SW_MANIFEST' or explicitly set to 'self.__WB_MANIFEST'.","message":"vite-plugin-serwist v10 changes the plugin option name from 'swSrc' to 'swSrc' (remains same) but modifies 'injectionPoint' default from 'self.__WB_MANIFEST' to 'self.__SW_MANIFEST'.","severity":"breaking","affected_versions":">=10.0.0"},{"fix":"Use import syntax in an ESM project (type: 'module' in package.json or .mjs extension).","message":"Using CommonJS require() is deprecated in v9+. The package is ESM-only.","severity":"deprecated","affected_versions":">=9.0.0"},{"fix":"Ensure your service worker source uses the same injection point identifier as the plugin config.","message":"The plugin expects a service worker source file that exports nothing by default; using a non-'self.__WB_MANIFEST' injection point requires updating both the plugin config and the service worker code.","severity":"gotcha","affected_versions":">=9.0.0"},{"fix":"Double-check that glob patterns are relative to the output directory (e.g., 'dist').","message":"Glob patterns in 'globPatterns' must be relative to 'globDirectory'; common mistake is using absolute paths or patterns that don't match.","severity":"gotcha","affected_versions":">=9.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Run 'npm install vite-plugin-serwist' and ensure all peer deps (vite, etc.) are installed.","cause":"Package not installed; or using older npm versions that don't resolve peer dependencies automatically.","error":"Cannot find module 'vite-plugin-serwist'"},{"fix":"Use 'import { SerwistPlugin } from 'vite-plugin-serwist'' correctly.","cause":"Incorrect import: using default import when it's a named export, or using CommonJS require without default.","error":"SerwistPlugin is not a function / SerwistPlugin is not a constructor"},{"fix":"Ensure the service worker source file is only imported in a Web Worker or Service Worker environment.","cause":"Attempting to use Serwist's service worker code in a non-worker context (e.g., main thread).","error":"Uncaught ReferenceError: self is not defined"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}