Registry / web-framework / vite-plugin-favicons-inject

vite-plugin-favicons-inject

library2.2.0jsnpmunverified

A Vite plugin that generates and injects favicons into HTML during build. Current version 2.2.0 (Mar 2023), maintained actively. It wraps the `favicons` package, supporting SVG sources and optional configuration. Unlike `vite-plugin-favicon`, it injects markup directly based on Vite's assets directory. Skips file generation in dev mode for HMR performance, but still injects markup. Uses ESM default export, also supports CJS. Key differentiator: simple migration path from deprecated `vite-plugin-favicon` and automatic path handling aligned with Vite's build.assetsDir.

web-framework

npm install vite-plugin-favicons-inject

github ↗package ↗

INSTALL

IMPORT

SIG · VITE-PLUGIN-FAVICO

vite-plugin-favicons-inject

web-frameworkjavascriptv2.2.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–223 runs

build_error

glibc

node 18–223 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

vitePluginFaviconsInject

✓ import vitePluginFaviconsInject from 'vite-plugin-favicons-inject';

✗ const { vitePluginFaviconsInject } = require('vite-plugin-favicons-inject');

Default export only, not named. Use default import or require the whole module.

vitePluginFaviconsInject

✓ const vitePluginFaviconsInject = require('vite-plugin-favicons-inject');

✗ const plugin = require('vite-plugin-favicons-inject').default;

CJS require returns the function directly, no .default property.

Plugin config options

✓ vitePluginFaviconsInject('./src/logo.svg', { /* favicons config */ }, { failGraciously: true })

✗ vitePluginFaviconsInject('./src/logo.svg', { failGraciously: true })

Second argument is favicons config, third is pluginConfig. Do not merge them.

Minimal setup: provide path to your SVG logo. The plugin generates favicons and injects markup during build.

// vite.config.js import { defineConfig } from 'vite'; import vitePluginFaviconsInject from 'vite-plugin-favicons-inject'; export default defineConfig({ plugins: [ vitePluginFaviconsInject('./src/assets/logo.svg'), ], });

Debug

Known issues

gotchaThe 'path' option in favicons config cannot be overridden; it is automatically set to Vite's assetsDir.

fix

Do not specify 'path' in the config object. Adjust Vite's build.assetsDir instead.

affects: >=2.0.0

gotchaIn development mode, no files are generated (affects HMR performance). Markup is still injected.

fix

If you want to avoid markup injection in dev, conditionally disable the plugin: process.env.NODE_ENV === 'production' ? vitePluginFaviconsInject() : false

affects: >=1.0.0

deprecatedThe plugin was created to replace the no-longer-maintained 'vite-plugin-favicon'. Migration: simple swap of import and plugin call.

fix

Replace import and usage of 'vite-plugin-favicon' with this plugin; see README for details.

affects: >=1.0.0

gotchaThe source path is relative to the project root, not the vite config file location.

fix

Use a path starting with './src/...' from the project root.

affects: >=1.0.0

Errors

Common errors & fixes

Cannot find module 'vite-plugin-favicons-inject'

Package not installed or typo in import path.

fix

Run 'npm install vite-plugin-favicons-inject' and ensure the import is correct.

[vite] Internal server error: favicons is not a function

Missing peer dependency 'favicons' or mismatch version.

fix

Install 'favicons' as a dependency: 'npm install favicons'.

TypeError: vitePluginFaviconsInject is not a function

Using named import instead of default import.

fix

Use 'import vitePluginFaviconsInject from ...' or 'const vitePluginFaviconsInject = require(...)'.

Upgrade

Version history

2.2.0latest on npm

Audit

Dependencies

faviconsrequiredCore generator for favicon files and HTML markup.

Agent activity

7 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/JohnPremKumar/vite-plugin-favicons-inject ↗

packagehttps://www.npmjs.com/package/vite-plugin-favicons-inject ↗