vue-iconfont-online

中文文档 | DEMO

Makes it easier to reference The Alibaba Iconfont icon library!

This is for vue 2.x

Installing

This package is available on npm.

Using npm:

npm install --save vue-iconfont-online

Using yarn:

yarn add vue-iconfont-online

Usage

As a vue directive

JS

import IconFontOnline from 'vue-iconfont-online';
Vue.use(IconFontOnline, {
  url: '//at.alicdn.com/t/font_2292720_gpwudclzhf6.css',
  symbol: 'alibaba-',
  fontFamily: 'alibaba-icon',
  fontSize: 22
})

If you want to load multiple icon libraries

import IconFontOnline from 'vue-iconfont-online';
Vue.use(IconFontOnline, [{
    url: '//at.alicdn.com/t/font_2292720_gpwudclzhf6.css',
    symbol: 'alibaba-',
    fontFamily: 'alibaba-icon',
    fontSize: 22
  },
  {
    url: '//at.alicdn.com/t/font_1151961_6sy5eu8oe36.css',
    symbol: 'shn-',
    fontFamily: 'shni',
    fontSize: 22
  }
])

HTML

<i class="alibaba-seleted"></i>

Options

Attribute	Description	Type	Default
url	Alibaba iconfont online link.	String	//at.alicdn.com/t/font_2292720_gpwudclzhf6.css
symbol	Alibaba iconfont FontClass/Prefix Symbol.	String	alibaba-
fontFamily	Alibaba iconfont FontFamily.	String	alibaba-icon
fontSize	icon default size.	Number	16