{"library":"serviceworker-webpack-plugin","title":"serviceworker-webpack-plugin","description":"A webpack plugin (v1.0.2, latest) that simplifies creating a service worker to cache all webpack bundle assets. It automatically resolves asset names (including hashed names for long-term caching) and provides them to a custom service worker script via a global `serviceWorkerOption` variable. Supports webpack 4 only (peer dependency). Key differentiator: it handles non-deterministic asset names and integrates with webpack's dev server. Alternatives like `workbox-webpack-plugin` are more full-featured but heavier; this plugin is minimal and focused.","language":"javascript","status":"active","last_verified":"Sat Apr 25","install":{"commands":["npm install serviceworker-webpack-plugin"],"cli":null},"imports":["import ServiceWorkerWebpackPlugin from 'serviceworker-webpack-plugin';","import runtime from 'serviceworker-webpack-plugin/lib/runtime';","// Global variable injected into the service worker script at build time"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"// webpack.config.js\nimport path from 'path';\nimport ServiceWorkerWebpackPlugin from 'serviceworker-webpack-plugin';\n\nexport default {\n  entry: './src/index.js',\n  output: {\n    path: path.resolve(__dirname, 'dist'),\n    filename: 'bundle.[chunkhash].js',\n    publicPath: '/',\n  },\n  plugins: [\n    new ServiceWorkerWebpackPlugin({\n      entry: path.join(__dirname, 'src/sw.js'),\n    }),\n  ],\n};\n\n// src/sw.js\nself.addEventListener('install', function(event) {\n  event.waitUntil(\n    caches.open('my-cache').then(function(cache) {\n      return cache.addAll(serviceWorkerOption.assets);\n    })\n  );\n});\n\nself.addEventListener('fetch', function(event) {\n  event.respondWith(\n    caches.match(event.request).then(function(response) {\n      return response || fetch(event.request);\n    })\n  );\n});\n\n// src/index.js\nimport runtime from 'serviceworker-webpack-plugin/lib/runtime';\n\nif ('serviceWorker' in navigator) {\n  runtime.register();\n}","lang":"javascript","description":"Demonstrates setup: plugin in webpack config, custom service worker that caches all assets, and runtime registration in main bundle.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}