{"id":22685,"library":"vite-plugin-hashed-favicons","title":"Vite Plugin Hashed Favicons","description":"A Vite plugin that generates hashed favicons (ico, png, masked, apple-touch, web manifest) from a single optimized SVG source. Current stable version is 2.1.0 (April 2026), with frequent updates following a semver cadence. Unlike heavy favicon generators, this plugin follows the minimalist Evil Martians approach (2021) producing only essential files with content-hash filenames for cache busting. Ships TypeScript types. Requires Vite ^5.0.12 || ^6.0.0 || ^7.0.0 || ^8.0.0 as peer dependency. Key differentiator: zero runtime dependencies, SVG-only input, simplified output set.","status":"active","version":"2.1.0","language":"javascript","source_language":"en","source_url":"https://github.com/DASPRiD/vite-plugin-hashed-favicons","tags":["javascript","vite","plugin","favicons","hashed","typescript"],"install":[{"cmd":"npm install vite-plugin-hashed-favicons","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-hashed-favicons","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-hashed-favicons","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency required for plugin hooks and build pipeline","package":"vite","optional":false}],"imports":[{"note":"Default export only; named import will give undefined","wrong":"import { favicons } from 'vite-plugin-hashed-favicons'","symbol":"favicons","correct":"import favicons from 'vite-plugin-hashed-favicons'"},{"note":"Virtual module available only when plugin option 'inject' is false. Also, add 'vite-plugin-hashed-favicons/virtual' to tsconfig types for TypeScript support.","wrong":"import { favicons } from 'virtual:hashed-favicons'","symbol":"virtual:hashed-favicons","correct":"import favicons from 'virtual:hashed-favicons'"},{"note":"CommonJS require is supported. Ensure your vite config file uses CJS or .cjs extension if mixing module systems.","symbol":"require('vite-plugin-hashed-favicons')","correct":"const favicons = require('vite-plugin-hashed-favicons');"}],"quickstart":{"code":"// vite.config.ts\nimport favicons from 'vite-plugin-hashed-favicons';\nimport { defineConfig } from 'vite';\n\nexport default defineConfig({\n  plugins: [\n    favicons('./src/assets/favicon.svg', {\n      webManifest: {\n        name: 'My App',\n        start_url: '/',\n        display: 'standalone',\n        background_color: '#ffffff',\n        theme_color: '#000000',\n      },\n      inject: true, // default: automatically inject into HTML\n    }),\n  ],\n});","lang":"typescript","description":"Configures Vite to generate hashed favicons from an SVG source with custom web manifest settings."},"warnings":[{"fix":"Upgrade from v1: ensure source is an optimized SVG file (not PNG). Remove any options related to the old `favicons` package. Check the generated set of icons – only essential ones remain.","message":"v2.0.0 replaces the `favicons` package with an own implementation, generating fewer icons and requiring SVG input only.","severity":"breaking","affected_versions":">=2.0.0"},{"fix":"If you relied on specific sizes (e.g., 16x16, 48x48), you must generate them separately or adjust expectations.","message":"v2.0.0 removed support for multiple favicon sizes; only 32x32 ico and standard PNG variants are produced.","severity":"breaking","affected_versions":">=2.0.0"},{"fix":"Set inject: false in plugin options when using virtual:hashed-favicons.","message":"The `inject` option defaults to true (auto-inject into HTML). If you want to use the virtual module, you must explicitly set `inject: false`.","severity":"gotcha","affected_versions":">=2.1.0"},{"fix":"Ensure your project uses Vite 5, 6, 7, or 8. For Vite 4 or below, keep version 1.x or upgrade Vite.","message":"Peer dependency `vite` must satisfy either ^5.0.12, ^6.0.0, ^7.0.0, or ^8.0.0. Older or newer major versions will cause install warnings or errors.","severity":"gotcha","affected_versions":">=2.0.7"},{"fix":"Migrate to v2.0.0+ as described in the changelog. Replace source image with SVG and adjust configuration.","message":"v1.x is deprecated and no longer maintained. It relied on the external `favicons` package and had security issues with subdependencies.","severity":"deprecated","affected_versions":"<2.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Add `inject: false` to the favicons plugin options.","cause":"Using the virtual module without disabling injection in plugin options.","error":"Error: Could not resolve 'virtual:hashed-favicons'"},{"fix":"Use `import favicons from 'vite-plugin-hashed-favicons'` (no curly braces).","cause":"Using named import instead of default import.","error":"TypeError: favicons is not a function"},{"fix":"Run `npm install vite-plugin-hashed-favicons` and ensure Vite version is ^5.0.12 || ^6.0.0 || ^7.0.0 || ^8.0.0.","cause":"Package not installed or incorrect peer dependency version.","error":"Module not found: Error: Can't resolve 'vite-plugin-hashed-favicons'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}