3.0.1 • Published 3 years ago

em-icon v3.0.1

Weekly downloads
-
License
ISC
Repository
-
Last release
3 years ago

em-icon

Icon svg asset or font

Install

npm install --save em-icon

Add to project

Global

#stylesheet.css
@font-face{font-family:'Icons';src:url('icon.ttf');}
@font-face{font-family:'IconsMain';src:url('icon-main.ttf');}

Vue.use options

Vue.use(EmIcon,options)ComponentOptions
//Code point data
//./glyphs/icons1.js
export default [
{name: 'icon_name', code_point: 'e001'},
{name: 'icon2_name', code_point: 'e002'}
]
//./glyphs/icons2.js
export default [
    {name: 'icon_name', code_point: 'e001'},
    {name: 'icon2_name', code_point: 'e002'}
]
//./glyphs/index.js
export { default as Icons1} from './icons'
export { default as Icons2} from './icons2'
// main.js
import EmIcon from "em-icon";
import {Icons,IconsMain} from './glyphs/index'
Vue.use(EmIcon,{
    glyphs:[
        {font:'Icons',data:Icons},
        {font:'IconsMain',data:IconsMain}
        ]})
Vue.use(EmIcon);

Local Usage

<template>
  <div>
      <em-icon name="icon_name" />
      <em-icon name="icon_name" font="IconsMain" />
  </div>
</template>
<script>
  export default {
    name: 'component.vue',
    components: {EmSvg},
  }
</script>

Setup

Parameters

Props(Parameter)TypeDefaultDescription
name (required)String-name icon(font) or path(svg)
fontStringiconsfont family name
heightNumbernullheight icon element
widthNumbernullwidth icon element
is-pointerBooleanfalsepointer event on/off
as-imageBooleanfalseicon as img

License

The MIT License