Vue feather icons for vue3. Icons with names in readme folder.
- Vue 3.3 or higher
npm install --save danilovl-vue-feather-icons
npm install --save https://github.com/danilovl/vue-feather-icons
If you import icon from src/dist
, there ia already imported import {h} from 'vue'
.
import * as icons from 'danilovl-vue-feather-icons/src/dist/vue-feather-icons'
import * as icons from 'danilovl-vue-feather-icons/src/dist/vue-feather-icons.min'
import {ActivityIcon} from 'danilovl-vue-feather-icons/src/dist/vue-feather-icons'
<script>
import * as icons from 'danilovl-vue-feather-icons/src/dist/vue-feather-icons'
const svg = h(icons['ActivityIcon']);
</script>
<ActivityIcon/>
<script setup>
import {ActivityIcon} from 'danilovl-vue-feather-icons/src/dist/vue-feather-icons'
</script>
If you import icon separately from src/icons
, you must check if h
globally exists. If not, you must set it to icon.
import {ActivityIcon} from 'danilovl-vue-feather-icons/src/icons/ActivityIcon'
<ActivityIcon :h="h"/>
<script setup>
import {h} from 'vue'
import {ActivityIcon} from 'danilovl-vue-feather-icons/src/icons/ActivityIcon'
</script>
Every icon has props parameters.
h
is a Vue render function and does not exist globally.
svg
is used when you want to add additional tags to the SVG element.
props: {
h: {
type: Object,
required: false
},
svg: {
type: Object,
required: false
}
}
The Vue feather icons is open-sourced software licensed under the MIT license.