A high-quality SVG icons for Vue.js

by Vue.js Examples

vue-heroicons

A set of free MIT-licensed high-quality SVG icons for Vue.js development.

View Demo View Github

Install

  • npm
    npm i @bytegem/vue-heroicons -S
  • yarn
    yarn add @bytegem/vue-heroicons

Using

Global register components：

import Vue from 'vue';
import Heroicons from '@bytegem/vue-heroicons';

Vue.use(Heroicons /* , options */);

Options

Key Desc
compomnents Vue Components. You can only register part of the Heroicons icon component globally or a custom Vue component.
removePrefix Used to remove the Heroicons prefix from the component name.
onlySolid Register only solid style icon components.
onlyOutline Register only outline style icon components.

Only one of them can be set for onlysolid and onlyoutline selection, otherwise unexpected registration will occur

Only using single Icon to Vue Component

import { HeroiconsAnnotationOutline } from '@bytegem/vue-heroicons';

export default {
    components: { HeroiconsAnnotationOutline }
};

Example

<HeroiconsAnnotationOutline />

Or

<heroicons-annotation-outline />

Package sizes

name size gzip
heroicons.umd.min.js 181.97 KiB 34.67 KiB
heroicons.umd.js 757.71 KiB 58.13 KiB
heroicons.common.js 757.32 KiB 58.01 KiB

GitHub