1. 打开 http://www.iconfont.cn/

2. 选择我们喜欢的图标，点击上面的小车，加入图标库，即右侧的购物车

3.点击购物车，点击下载代码

4.解压下载的文件夹，将文件夹复制到 assets文件夹中

4.引用iconfont.css

<style>

@import '../assets/icon/iconfont.css';    // 引用 iconfont.css

</style>

5.在用到图标的组件中写：

    <i class="icon iconfont icon-hehuoren"></i>

这样就可以引用到你想要的iconfont图标啦

如何在vue项目中引入阿里巴巴的iconfont图库的更多相关文章

  1. 如何在Vue项目中引入jQuery?

    假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...

  2. 详解如何在vue项目中引入饿了么elementUI组件

    在开发的过程之中,我们也经常会使用到很多组件库:vue 常用ui组件库:https://blog.csdn.net/qq_36538012/article/details/82146649 今天具体说 ...

  3. 如何在vue项目中引入elementUI组件

    个人博客同步文章 https://mr-houzi.com/2018/02/... 前提:已经安装好Vue 初始化vue vue init webpack itemname 运行初始化demo 运行一 ...

  4. 如何在vue项目中引入element-ui

    安装 elementUI npm install element-ui --save 引入elementUI import ElementUI from 'element-ui' import 'el ...

  5. vue项目中引入Sass

    Sass作为目前成熟,稳定,强大的css扩展语言,让越来越多的前端工程师喜欢上它.下面介绍了如何在vue项目 中引入Sass. 首先在项目文件夹执行命令 npm install vue-cli -g, ...

  6. 如何在Vue项目中给路由跳转加上进度条

    1.前言 在平常浏览网页时,我们会注意到在有的网站中,当点击页面中的链接进行路由跳转时,页面顶部会有一个进度条,用来标示页面跳转的进度(如下图所示).虽然实际用处不大,但是对用户来说,有个进度条会大大 ...

  7. 如何在VUE项目中添加ESLint

    如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...

  8. 在vue项目中引入jquery

    在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...

  9. 如何在Vue项目中使用Typescript

    0.前言 本快速入门指南将会教你如何在Vue项目中使用TypeScript进行开发.本指南非常灵活,它可以将TypeScript集成到现有的Vue项目中任何一个阶段. 1.初始化项目 首先,创建一个新 ...

随机推荐

  1. 【Redis】三、Redis安装及简单示例

    (四)Redis安装及使用   Redis的安装比较简单,仍然和大多数的Apache开源软件一样,只需要下载,解压,配置环境变量即可.具体安装过程参考:菜鸟教程Redis安装.   安装完成后,通过r ...

  2. 代码分析工具splint安装介绍

    官网 http://www.splint.org/ splint能干什么? splint是一个静态检查C语言代码安全弱点和编写错误的开源程序.(不支持C++) splint会进行多种常规检查,包括 空 ...

  3. Autolayout性能优化

    客户的需求就是我们进步的动力.最近有客户提出大数据量Topo图的自动布局问题,在Topo中除了Node.Link,还包括Group.Subnetwork等容器组件.在这样的情况下,我们抛开布局算法不谈 ...

  4. apacheAB测试指标

    在进行性能测试过程中有几个指标比较重要: 1.吞吐率(Requests per second) 服务器并发处理能力的量化描述,单位是reqs/s,指的是在某个并发用户数下单位时间内处理的请求数.某个并 ...

  5. MySQL数据库grant授权命令

    MySQL数据库grant授权命令 制作人:全心全意 grant授权命令的使用 grant授权命令使用语法: grant 权限 on 数据库对象 to 用户 grant 权限 on 数据库对象 to ...

  6. OpenCV+Python识别车牌和字符分割的实现

    本篇文章主要基于python语言和OpenCV库(cv2)进行车牌区域识别和字符分割,开篇之前针对在python中安装opencv的环境这里不做介绍,可以自行安装配置! 车牌号检测需要大致分为四个部分 ...

  7. ModelMap org.springframework.ui.ModelMap

    ModelMap实现了map接口,可以在其中存放属性,作用域同request,同时可与@SessionAttributes联合使用,把数据放入到session中去, 下面这个示例,我们可以在Model ...

  8. noip模拟赛 立方数

    题目描述LYK定义了一个数叫“立方数”,若一个数可以被写作是一个正整数的3次方,则这个数就是立方数,例如1,8,27就是最小的3个立方数.现在给定一个数P,LYK想要知道这个数是不是立方数.当然你有可 ...

  9. sheepdog简介

    1.corosync,single ring最多支持50个节点:zookeeper,500个节点可稳定支撑,1000-1500个节点挑战比较大,需要优化消息传递机制. 2.sheepdog一开始为分布 ...

  10. [K/3Cloud]如何解决kdpkg无法部署到业务站点的问题

    自从下载了sp1后,就迫不急待的试用下,看看反馈的几个关键bug是否修复,可惜sp1安装后发现业务站点下的组件一个都没有被更新,这指定是有问题了,这真是让哥百思不得其解,真后悔在研发时没仔细研究下部署 ...