{"id":22927,"library":"vite-plugin-web-extension","title":"Vite Plugin Web Extension","description":"Vite plugin (v4.5.1) for building web extensions with Vite, supporting all major browsers. It automatically builds inputs from manifest.json, enables HMR in dev mode, validates manifests, and integrates with frontend frameworks like React, Vue, or Svelte. Published weekly with active maintenance. Differentiators: zero-config manifest-based setup, built-in dev server launching and extension reloading, and comprehensive TypeScript types.","status":"active","version":"4.5.1","language":"javascript","source_language":"en","source_url":"https://github.com/aklinker1/vite-plugin-web-extension","tags":["javascript","vite-plugin","web","webext","chrome-extension","web-extension","browser-extension","extension","chrome","typescript"],"install":[{"cmd":"npm install vite-plugin-web-extension","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-web-extension","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-web-extension","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"Default export, not named.","wrong":"import { webExtension } from 'vite-plugin-web-extension'","symbol":"webExtension","correct":"import webExtension from 'vite-plugin-web-extension'"},{"note":"Type only import v4.1+.","wrong":"import { WebExtConfig } from 'vite-plugin-web-extension'","symbol":"WebExtConfig","correct":"import type { WebExtConfig } from 'vite-plugin-web-extension'"},{"note":"Named export for extending manifest config.","wrong":null,"symbol":"webExtendConfig","correct":"import { webExtendConfig } from 'vite-plugin-web-extension'"},{"note":"defineConfig is from Vite, not this plugin.","wrong":"import { defineConfig } from 'vite-plugin-web-extension'","symbol":"defineConfig","correct":"import { defineConfig } from 'vite'"}],"quickstart":{"code":"// vite.config.ts\nimport { defineConfig } from 'vite';\nimport webExtension from 'vite-plugin-web-extension';\n\nexport default defineConfig({\n  plugins: [\n    webExtension({\n      // optional: specify manifest path, defaults to 'manifest.json'\n      manifest: 'src/manifest.json',\n      // optional: web-ext options, e.g., browser, firefox\n      webExtConfig: {\n        browser: 'chromium',\n      },\n    }),\n  ],\n});","lang":"typescript","description":"Basic setup with TypeScript, specifying manifest path and browser target."},"warnings":[{"fix":"Replace 'firefox: { ... }' with 'webExtConfig: { firefox: ... }'.","message":"'firefox' option is deprecated. Use 'webExtConfig' instead.","severity":"deprecated","affected_versions":">=4.4.1"},{"fix":"Run a JSON linter on manifest.json before building.","message":"manifest must be valid JSON or the build will fail silently.","severity":"gotcha","affected_versions":"all"},{"fix":"Upgrade Vite to version 5 or later.","message":"Vite 4 support removed; requires Vite 5+.","severity":"breaking","affected_versions":">=4.4.2"},{"fix":"Ensure content_scripts are defined in manifest.json, not just as separate entry points.","message":"Content scripts must be listed in manifest.json to be processed.","severity":"gotcha","affected_versions":"all"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Use import webExtension from 'vite-plugin-web-extension' as the plugin.","cause":"Incorrect usage of webExtendConfig as a plugin instead of importing webExtension.","error":"Error: The 'webExtendConfig' function is used as a plugin but is not a valid Vite plugin."},{"fix":"Ensure manifest.json exists at the project root or provide the 'manifest' option.","cause":"Missing or misconfigured manifest.json in the project root.","error":"TypeError: Cannot read properties of undefined (reading 'plugins')"},{"fix":"Use 'import webExtension from 'vite-plugin-web-extension''.","cause":"Named import 'plugin' does not exist; the default export is used.","error":"Module '\"vite-plugin-web-extension\"' does not export a named export 'plugin'."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}