UNPKG

mdi-vue

Version:

Material Design Icons for Vue.js

74 lines (51 loc) 1.36 kB
# Material Design Icons for Vue.js This library should grant an easy-to-use interface to icons from MDI. Import only those icons you need, does not require further configuration. Install it and use it without bloating your source code. Enjoy! ## How to use Simply install it using your favourite package manager eg: ``` $ npm install --save mdi-vue ``` ``` $ yarn add mdi-vue ``` ### Import and usage Simply import the icon you wish to use to your vue project with the CommonJS syntax like in the following examples: ```js require('mdi-vue/Hotel.vue'); import 'mdi-vue/CommentAlert.vue'; ``` Example.vue: ```vue <template> <div> My hand is a <hook-icon /> </div> </template> <script> import HookIcon from 'mdi-vue/Hook' // works without an extension too export { components: [ HookIcon, ] } </script> ``` ## Global imports Just as any component, icons can be registered globally using `Vue.component` as in the following example. ## Example ```js const Vue = require('vue') const HumanIcon = require('mdi-vue/Human.vue') Vue.component('human-icon', HumanIcon) new Vue({ el: '#some-html-element', template: '<human-icon />' }) ``` Heavily inspired by [mdi-react](https://github.com/levrik/mdi-react/). ## Used resources - [Material Design Icons](https://materialdesignicons.com/) - [Vue.js](https://vuejs.org/)