shidianxia / vue-feather-icons

Feather icons plugin for Vue.js, SSR supported.

Vue Feather Icons

Feather icons plugin for Vue.js, SSR supported.

Demo

Jsfiddle

Installation

npm install --save vue-feather-icons-ssr

Usage

Bundler (Webpack, Rollup)

import Vue from 'vue'
//for convenience, import as alias
import {VueFeatherIconsSsr as icon} from 'vue-feather-icons-ssr'
//use the code below to support SSR
//import {VueFeatherIconsSsrJsx as icon} from 'vue-feather-icons-ssr'

//register it globally
Vue.component('icon', icon)

<!-- name option index: https://feathericons.com
pass the name of feather icon to display the icon you want -->
<icon name="github"></icon>
<!-- you can also pass any SVG compatible attributes to the component -->
<icon name="github" stoke-width="1"></icon>

Browser

<!-- Include after Vue -->
<!-- Local files -->
<script src="vue-feather-icons-ssr/dist/vue-feather-icons-ssr.js"></script>

<!-- From CDN -->
<script src="https://unpkg.com/vue-feather-icons-ssr"></script>

Development

Launch visual tests

npm run dev

Launch Karma with coverage

npm run dev:coverage

Build

Bundle the js and css of to the dist folder:

npm run build

Thanks to

Feather Icons

License

MIT

vue-feather-icons's Issues

Size parameter bug

When changing size the viewBox should be the same (24px) else the SVG will be showing half or smaller (in case of larger size then the default 24px).