A unplugin plugin to generate iconfonts from SVGs using fantasticon.

npm i -D unplugin-fantasticon

yarn add -D unplugin-fantasticon

pnpm add -D unplugin-fantasticon

// vite.config.ts
import Fantasticon from 'unplugin-fantasticon/vite'

export default defineConfig({
  plugins: [
    Fantasticon({ /* options */ }),
  ],
})

// rollup.config.js
import Fantasticon from 'unplugin-fantasticon/rollup'

export default {
  plugins: [
    Fantasticon({ /* options */ }),
  ],
}

// webpack.config.js
module.exports = {
  /* ... */
  plugins: [
    require('unplugin-fantasticon/webpack')({ /* options */ })
  ]
}

// nuxt.config.js
export default defineNuxtConfig({
  modules: [
    ['unplugin-fantasticon/nuxt', { /* options */ }],
  ],
})

// vue.config.js
module.exports = {
  configureWebpack: {
    plugins: [
      require('unplugin-fantasticon/webpack')({ /* options */ }),
    ],
  },
}

// esbuild.config.js
import { build } from 'esbuild'
import Fantasticon from 'unplugin-fantasticon/esbuild'

build({
  plugins: [Fantasticon()],
})

This plugin uses the same options as fantasticon.

There are some additional options that can be used to configure the plugin:

• Type: (userOptions: RunnerOptions, mustWrite?: boolean) => Promise<RunnerResults>
• Default: generateFonts from @twbs/fantasticon

This option allows you to provide a custom function to generate the icon fonts. The function should return a promise that resolves to the results of the font generation.

• Type: boolean
• Default: true

If set to true, the plugin will inject a <link> tag into the HTML files to load the generated CSS file. This is useful for development, but you may want to disable it in production.

• @twbs/fantasticon: The underlying library used to generate the icon fonts. It is a fork of the original fantasticon library with some improvements and bug fixes.
• @varlet/unplugin-icon-builder: A similar unplugin that generates icon fonts from SVGs, but uses @varlet/icon-builder instead of fantasticon. It is designed to work with the Varlet UI library, but can be used independently as well.
• unplugin-icons: A unplugin that provides a collection of popular icon sets as Vue components, React components, and SVGs. It supports various icon sets like FontAwesome, Material Icons, and more.

This plugin is inspired by vite-plugin-fantasticon, which is a Vite plugin that does the same thing.

This project is licensed under MIT.