1.去阿里图标矢量图标库将想要的图标添加入库

2.再去库中将图标添加到项目。

3.再到我的项目中，选择，我这里采用的是将图标代码包下载到本地再引入到vue项目中。

4.在vue项目的assets文件夹下新建一个iconfont文件夹（名字随意），将刚刚下载下来的代码包中的iconfont.css、iconfont.eto、iconfont.svg、iconfont.ttf、iconfont.woff复制到iconfont文件夹下。

5.在main.js中全局引入iconfont.css。

6.之后就可以在项目中正常使用了

vue 引入阿里图标的更多相关文章

  1. VUE 引入阿里图标库

    本身项目是VUE, Element-UI项目, 所以内置Element-UI图标库 地址如下, https://element.eleme.cn/#/zh-CN/component/icon 使用时: ...

  2. 在vue项目中引入阿里图标库小记

    使用Vue技术栈开发不仅效率高,而且很友好,而且还有很多基于vue的UI框架,例如:element等,但是这类框架美中不足的是,图标太少.为了解决这个问题,不得不引入第三方字体库,今天以阿里图标库为例 ...

  3. vue 外卖app(3) 引入阿里图标

    1.登陆阿里图标官网 2.点击搜索按钮,输入你想要搜索的图标,加入购物车,保存到项目中 3.在项目中使用

  4. VUE引入字体图标库

    1. 下载阿里图标 2. 解压文件,并复制文件到VUE项目内 3. 找到添加的字体图标的.css文件,将.iconfont改成[class^="iconfont"], [class ...

  5. 前端学习笔记系列一：5 在项目中引入阿里图标icon

    进入到阿里的图标库网站,里面有上百万种icon,https://www.iconfont.cn,需要注册一个帐号,然后进入到这个页面,在这里点击右下角的带加号的图标,创建一个新的项目,名称与你要使用图 ...

  6. Vue引用阿里图标库

    首先进入官网http://www.iconfont.cn/ 转载:https://blog.csdn.net/qq_34802010/article/details/81451278 选择图标库 在里 ...

  7. react+antd引入 阿里图标

    import iconfont from '../../../../assets/fonts/iconfont.js' const Iconfont = Icon.createFromIconfont ...

  8. uni-app 引入本地iconfont的正确姿势以及阿里图标引入

    1.引入本地iconfont iconfont文件里面包含 iconfont.ttf.iconfont.css, 将 iconfont.tt64文件转位 base64.推荐转换工具地址:https:/ ...

  9. Vue、Element-ui项目中如何使用Iconfont(阿里图标库)

    我们使用element-ui.vue开发网站的时候,往往图标是起着很重要的作用. 下面是vue.element-ui项目,如何使用阿里iconfont图标库的方法. 准备工作 1. 先注册,再登录.找 ...

随机推荐

  1. k8s应用配置详解

    1. 概述 k8s主要通过Object定义各种部署任务(例如:部署应用.部署Ingress路由规则.部署service等等),通过kubectl命令远程操作k8s集群. Object的定义通常以Yam ...

  2. 【JAVA】 04-Java中的多线程

    链接: 笔记目录:毕向东Java基础视频教程-笔记 GitHub库:JavaBXD33 目录: <> <> 内容待整理: 多线程引入 概述 多线程: 进程:正在执行中的程序,其 ...

  3. JavaFX程序初次运行创建数据库并执行建表SQL

    在我的第一个JavaFX程序完成安装的时候才突然发现,不能要用这个软件还要手动执行Sql来建表吧? 于是我的想法是在Main程序中执行时检测数据库连接状况,如果没有检测到数据库或者连接异常,那么出现错 ...

  4. ApacheHttpServer出现启动报错：the requested operation has failed解决办法

    转自:https://www.jb51.net/article/21004.htm 原因一:80端口占用 例如IIS,另外就是迅雷.我的apache服务器就是被迅雷害得无法启用! 原因二:软件冲突 装 ...

  5. Sass--传一个不带值的参数

    Sass 的混合宏有一个强大的功能,可以传参,那么在 Sass 中传参主要有以下几种情形: A) 传一个不带值的参数 在混合宏中,可以传一个不带任何值的参数,比如: @mixin border-rad ...

  6. jmeter 参数化1_User Parameters（用户参数）

    参数化:是自动化测试脚本的一种常用技巧,可将脚本中的某些输入使用参数来代替,如登录时利用GET/POST请求方式传递参数的场景,在脚本运行时指定参数的取值范围和规则. 脚本在运行时,根据需要选取不同的 ...

  7. 如何在Ubuntu 18.04上安装Apache Web服务器

    一. apt库安装 1.在终端输入更新检查命令,sudo apt-get update 2. 在更新完成后(如果不想检查更新,也可直接输入此步)输入:sudo apt-get install apac ...

  8. pugixml的使用

    VS项目,头文件处鼠标右键,添加“新建筛选器”,重命名为pugixml,把3个文件添加进来.在用到框架的文件中只需#include"pugixml\pugixml.hpp"即可. ...

  9. Linux中的uniq命令（去掉重复项，输出重复项）

    ls /bin /usr/bin | sort | uniq | less 上面这条命令的实际效果是: 获得 ls /bin /usr/bin 的 output 将上述 output 进行 sort ...

  10. Appium环境搭建（Appium库的安装）

    Appium环境搭建 谷歌驱动和对照:注意:64位向下兼容,直接下载32位的就可以啦,亲测可用. https://blog.csdn.net/allthewayforward/article/deta ...