Skip to content
IconFont plugin for Vuejs
JavaScript Vue
Branch: master
Clone or download
Latest commit 8c588d1 Mar 4, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
demo v1.0.0 Sep 13, 2017
dist
src v1.0.0 Sep 13, 2017
.babelrc v1.0.0 Sep 13, 2017
.gitignore add .travis.yml Oct 6, 2017
.npmignore update readme Sep 13, 2017
.travis.yml add .travis.yml Oct 6, 2017
README-cn.md Update README-cn.md Mar 4, 2019
README.md update readme Oct 12, 2017
package.json 升级webpack4,Fix a potential security vulnerability in dependencies. Jan 11, 2019
webpack.config.js 升级webpack4,Fix a potential security vulnerability in dependencies. Jan 11, 2019

README.md

vue-icon-font

Build Status Vue 2.x

A iconfont plugin for Vuejs 中文说明

Screenshots

screenshot screenshot screenshot

Installation

NPM (Recommended)

# install dependencies
npm install vue-icon-font

manual

# Download `dist/vue-iconfont.js` and include it in your HTML file
<script src="../dist/vue-iconfont.js"></script>

Iconfont assets

It’s a Vector Icon Management & Communication Platform made by Alimama MUX, designers could upload vector icons here, and users could download it by several kinds of format.Also, the icons could be translated into Fonts for front-end engineers’ usage. screenshot

Download the icons from iconfont.cn, and upzip download.zip.

font-class

copy iconfont.css and font files (.ttf,.eot,.svg,.woff) into your project

# Include the iconfont.css stylsheet into your <head>
<link rel="stylesheet" href="./iconfont.css">

or

# Import css
import './iconfont.css';

use: <icon name="account" type="class"></icon>

symbol,svg (Default,Recommended)

copy iconfont.js into your project

# Include the iconfont.css stylsheet into your <head>
<link rel="stylesheet" href="./iconfont.css">

or

import './iconfont.js';

use: <icon name="password"></icon>

Usage via import (vue-cli)

import Vue from 'vue'
import VueIconFont from 'vue-icon-font'
Vue.use(VueIconFont)

/* font-class */
import '@/assets/iconfont/iconfont.css'

/* symbol,svg */
import '@/assets/iconfont/iconfont.js'
<!-- font-class -->
<icon name="account" type="class"></icon>

<!-- symbol,svg -->
<icon name="password"></icon>

Simple demo here

You can’t perform that action at this time.