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. 在MONO Design中使用Flex3D

    在项目开发组的努力下,HTML5 3D 的开发包变得越来越优秀,越来越健壮:基于HTML5 3D技术的MONO Design建模平台功能也变得越来越强大和完善,这个方便了很多使用我们HTML5 3D的 ...

  2. 动态生成java、动态编译、动态加载

    我曾经见过一个“规则引擎”,是在应用系统web界面直接编写java代码,然后保存后,规则即生效,我一直很是奇怪,这是如何实现的呢?实际这就好像jsp,被中间件动态的编译成java文件,有被动态的编译成 ...

  3. java一维数组的声明、初始化及排序

    public class TestArray { public static void main(String[] args) { /** 数组声明及动态初始化 int a[] = new int[a ...

  4. LINUX-磁盘空间

    df -h 显示已经挂载的分区列表 ls -lSr |more 以尺寸大小排列文件和目录 du -sh dir1 估算目录 'dir1' 已经使用的磁盘空间' du -sk * | sort -rn ...

  5. java---括号匹配

    import java.util.HashMap;import java.util.LinkedList;import java.util.Map; /* *括号匹配 * 1.用栈实现,如果读取字符为 ...

  6. hdu 1874 dijkstra 队列实现 比数组高效特别在稀疏图

    参考  http://blog.csdn.net/zhuyingqingfen/article/details/6370561 刘汝佳白皮书 #include<stdio.h> #incl ...

  7. Win32编程API 基础篇 -- 2.一个简单的窗口 根据英文教程翻译

    一个简单的窗口 例子:简单的窗口 有时人们在IRC提问,”我应该怎样制作一个窗口”...嗯,这恐怕不是完全这么简单好回答!其实这并不难一旦你明白你在做什么,但在你得到一个可展示的窗口之前还有一些事情需 ...

  8. VNC Viewer 设置屏幕分辨率-解决屏幕分辨率问题

    https://blog.csdn.net/runningtortoises/article/details/51425332

  9. nyoj_116_士兵杀敌(二)_201404131107

    士兵杀敌(二) 时间限制:1000 ms  |  内存限制:65535 KB 难度:5   描述 南将军手下有N个士兵,分别编号1到N,这些士兵的杀敌数都是已知的. 小工是南将军手下的军师,南将军经常 ...

  10. T1683 车厢重组 codevs

    http://codevs.cn/problem/1683/  时间限制: 1 s  空间限制: 1000 KB  题目等级 : 白银 Silver 题目描述 Description 在一个旧式的火车 ...