Vuestrap Icons Component complements vuestrap web components with svg icons. SVG sprite consists of 223 icons from Iconic — www.useiconic.com/open plus two custom ones: circle-fill and circle-outline
Bower:
bower install vuestrap-icons- add script in your html document:
<script src="bower_components/vuestrap-icons/dist/vuestrapIcons.min.js"></script>- use it within your Vue instance like this:
new Vue({
el: '#app',
components: { 'vs-icon': vuestrapIcons.icons }
})From source:
npm install vuestrap-icons- import* desired component like so:
import icons from 'vuestrap-icons/src/components/icons'- load it in your Vue instance:
new Vue({
el: '#app',
components: { 'vs-icon': icons }
})*Note: You will need Babel Loader in your Webpack config file to support ES6 syntax.
You can then use icon component in your html, like so:
<vs-icon name="cog"></vs-icon>- create html page with list of icons
- testing