{"record":{"id":"bfc998760661d71f","repo":"vuejs/vue-cli","slug":"workboxpluginmode-is-not-a-supported-workbox-we","errorCode":null,"errorMessage":"${workboxPluginMode} is not a supported Workbox webpack plugin mode. Valid modes are: ${Object.keys(workboxWebpackModule).join(', ')}","messagePattern":"(.+?) is not a supported Workbox webpack plugin mode\\. Valid modes are: (.+?)","errorType":"validation","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/@vue/cli-plugin-pwa/index.js","lineNumber":42,"sourceCode":" const name = api.service.pkg.name\n\n // the pwa plugin hooks on to html-webpack-plugin\n // and injects icons, manifest links & other PWA related tags into \n webpackConfig\n .plugin('pwa')\n .use(require('./lib/HtmlPwaPlugin'), [Object.assign({\n name\n }, userOptions)])\n .after('html')\n\n // generate /service-worker.js in production mode\n if (process.env.NODE_ENV === 'production') {\n // Default to GenerateSW mode, though InjectManifest also might be used.\n const workboxPluginMode = userOptions.workboxPluginMode || 'GenerateSW'\n const workboxWebpackModule = require('workbox-webpack-plugin')\n\n if (!(workboxPluginMode in workboxWebpackModule)) {\n throw new Error(\n `${workboxPluginMode} is not a supported Workbox webpack plugin mode. ` +\n `Valid modes are: ${Object.keys(workboxWebpackModule).join(', ')}`\n )\n }\n\n const defaultOptions = {\n exclude: [\n /\\.map$/,\n /img\\/icons\\//,\n /favicon\\.ico$/,\n /^manifest.*\\.js?$/\n ]\n }\n\n const defaultGenerateSWOptions = workboxPluginMode === 'GenerateSW'\n ? { cacheId: name }\n : {}\n","sourceCodeStart":24,"sourceCodeEnd":60,"githubUrl":"https://github.com/vuejs/vue-cli/blob/7eb93c169c7520935252e2473387f923ef80d856/packages/@vue/cli-plugin-pwa/index.js#L24-L60","documentation":"cli-plugin-pwa instantiates the Workbox webpack plugin class named by `pwa.workboxPluginMode` (defaulting to `GenerateSW`). It checks the mode is an own/inherited key exported by `workbox-webpack-plugin`; if not, it lists the valid exports so you know what to use. Typical valid exports are `GenerateSW` and `InjectManifest`.","triggerScenarios":"Setting `pwa.workboxPluginMode` in vue.config.js to a value that is not exported by the installed workbox-webpack-plugin: wrong casing (`generateSW`, `Generate`), a removed/renamed export, or an unrelated string.","commonSituations":"Copy-pasting from older Workbox docs; a workbox major-version upgrade that changed exports; case mismatch.","solutions":["Use one of the documented exports — usually `'GenerateSW'` (auto-generated SW) or `'InjectManifest'` (custom SW).","Inspect valid keys: `Object.keys(require('workbox-webpack-plugin'))` and match exactly, including casing.","If you need InjectManifest, supply a `workboxOptions.swSrc` as well."],"exampleFix":"// vue.config.js — before\nmodule.exports = { pwa: { workboxPluginMode: 'generateSW' } }\n// after\nmodule.exports = { pwa: { workboxPluginMode: 'GenerateSW' } }","handlingStrategy":"validation","validationCode":"const validModes = Object.keys(require('workbox-webpack-plugin'))\nconst mode = userPwa.workboxPluginMode || 'GenerateSW'\nif (!validModes.includes(mode)) {\n throw new Error(`Invalid workboxPluginMode '${mode}'. Valid: ${validModes.join(', ')}`)\n}","typeGuard":"const isWorkboxMode = (m) => m && Object.prototype.hasOwnProperty.call(require('workbox-webpack-plugin'), m)","tryCatchPattern":null,"preventionTips":["Default to 'GenerateSW' unless you ship a custom service worker.","Copy the exact exported name and casing from workbox-webpack-plugin."],"tags":["pwa","workbox","configuration"],"backgroundTag":null,"analyzedSha":"7eb93c169c7520935252e2473387f923ef80d856","analyzedAt":"2026-08-13T10:13:37.803Z","schemaVersion":2},"datasetVersion":"2026-08-13T14:17:21.547Z"}