Skip to content

A Vite plugin for creating and injecting favicons during the application build!

License

Notifications You must be signed in to change notification settings

JohnPremKumar/vite-plugin-favicons-inject

Repository files navigation

vite-plugin-favicons-inject

npm license

A Vite plugin for creating and injecting favicons during the application build!

Install

$ npm install vite-plugin-favicons-inject

Usage

As ES6 Module

// In vite.config.js file

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

export default defineConfig({
  plugins: [
    ...
    vitePluginFaviconsInject('./src/assets/logo.svg'),
    ...
  ]
});

As CommonJs

// In vite.config.js file

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

export default defineConfig({
  plugins: [
    ...
    vitePluginFaviconsInject('./src/assets/logo.svg'),
    ...
  ]
});

Parameter

  • source - path of the logo file. Default: ./src/logo.png
  • config (optional) - favions config object. (refer favicons for all available options).
  • pluginConfig (optional) - Some internal plugin configurations - Default:
    {
      failGraciously: false, // set it to `true`for failing without errors(only applicable on exceptional cases)
    }

Note 'path' option in the config cannot be overriden as it is assigned to vite assetsDir:

{
  path: "<vite assets dir>" // destination path of generated favicons based on vite asset dir
}

More information about vite assets directory and how to change it can be found here

Development Mode

By default this plugin will not generate any files in the development mode since it will affect the HMR performance and overall development experience.

But, the markup will be injected into the HTML files. If you would like to avoid it you can optionally enable this plugin only on production mode like below:

process.env.NODE_ENV == "production" ? vitePluginFaviconsInject() : false

Note: the above suggestion assume you have a envionment variable called NODE_ENV properly configured in your application on the both production and development environments accordingly.

Compatibility

This plugin was created to easily migrate from vite-plugin-favicon which no longer seems to be working.

Just install, change the import and plugin config in vite config file. You are good to go!

License

MIT

About

A Vite plugin for creating and injecting favicons during the application build!

Topics

Resources

License

Stars

Watchers

Forks

Sponsor this project

 

Packages

No packages published