文章目录

  • 1. 进入阿里矢量图官网
  • 2.新建项目
  • 3.找到自己需要的矢量图
  • 4.在需要的组件内进行引入
  • 5.在放置矢量图
  • 7.修改html(class中粘贴矢量图代码,一定要加iconfont !!!!)

1. 进入阿里矢量图官网

阿里适量图库

2.新建项目


新建一个自己的项目

3.找到自己需要的矢量图


将该图标存入某个项目内






src/assets目录下新建一个目录,将复制的文件粘贴进去

4.在需要的组件内进行引入

import '@/assets/icon/iconfont.css'

5.在放置矢量图


先选择想要的矢量图的代码

7.修改html(class中粘贴矢量图代码,一定要加iconfont !!!)

<i class = "iconfont  icontianmaoxingxiang2" />

vue 踩坑笔记 二.vue引入阿里矢量图库的矢量图相关推荐

  1. Vue 踩坑笔记: 引入 ElementUI 时打包失败修复记录(ERROR in ./node_modules/element-ui/lib/theme-chalk/index.css)

    Vue 踩坑笔记: 引入 ElementUI 时打包失败修复记录(ERROR in ./node_modules/element-ui/lib/theme-chalk/index.css Module ...

  2. vue踩坑笔记06---vuex的state,getter,mustation,action,module

    Vuex是什么? Vuex核心属性: vuex的使用: state应用: getter应用: mutation应用: action应用: module应用: Vuex是什么? 官方文档说明: Vuex ...

  3. uniapp引入vantweapp踩坑笔记

    vue-cli创建uniapp项目引入vantweapp踩坑笔记 uni-app中引入vantweapp vue-cli创建uniapp项目引入vantweapp踩坑笔记 一.环境准备 二.项目搭建 ...

  4. 阿里云部署Tiny Tiny RSS踩坑笔记

    阿里云部署Tiny Tiny RSS踩坑笔记 前言 入坑了RSS,之前的配置是阿里云部署RSSHub,配合Inoreader进行文章阅读,详情见RSS入坑指南.阿里云部署RSSHub踩坑笔记.在202 ...

  5. EDUSOHO踩坑笔记之四十二:资讯

    EDUSOHO踩坑笔记之四十二:资讯 获取资讯列表信息 GET /articles/{id} 权限 老API,需要认证 参数 字段 是否必填 描述 sort string 否 排序,'created' ...

  6. Vue踩坑 npm ERR code ELIFECYCLE

    Vue踩坑 npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! supermall@0.1.0 serve: vue-cli-service serv ...

  7. iphone se 一代 不完美越狱 14.6 视频壁纸教程(踩坑笔记)

    iphone se 一代 不完美越狱 14.6 加 视频壁纸教程-踩坑笔记 越狱流程 1.爱思助手制作启动u盘 坑点: 2.越狱好后 视频壁纸软件 1.源 2.软件安装 越狱流程 1.爱思助手制作启动 ...

  8. OpenCV4.0.1/4.0.0/3.4.2 + Contrib + Qt5.9 + CMake3.12.1编译及踩坑笔记、Qt5+OpenCV配置、代码验证、效果图、福利彩蛋

    Table of Contents 前言 Windows 10, OpenCV4.0.1, Qt5.9.3, CMake3.12.1, MinGW5.3.0 Windows 10, OpenCV4.0 ...

  9. EDUSOHO踩坑笔记之六:edusoho架构及模块分析

    EDUSOHO踩坑笔记之六:edusoho架构及模块分析 从目录结构.入口文件.配置.控制器.服务层.模型.模块组成等几个角度,进行架构的描述.本文档是以8.0的版本为基准的说明,与其他版本会有些区别 ...

最新文章

  1. 【图像处理】——灰度变换心得(cv2.normalize规范化值0-255,cv2.convertScaleAbs(new_img)转为8位图)
  2. 回首阿里10年产品经理路,1点忠告希望在2021帮到你
  3. 清理注册表后导致Oracle listener起不来
  4. littlevgl抗锯齿_littlevgl架构浅析
  5. 作为曾经Oracle的一员,谈谈老东家的此次裁员
  6. Flutter之播放视频
  7. Android 批量修改文件名称
  8. 一个老乞丐一句话震惊中国人...............
  9. java 简体繁体互相转换
  10. MPQ 文件系统完成
  11. manjaro 亮度调节
  12. 西安邮电大学计算机学院军训,高考状元染网瘾无法自拔 5次考上大学3次退学
  13. Python程序员面试,这些问题你必须提前准备!
  14. Linux下的打包(tar)、压缩(gzip / bzip2)
  15. 互联网实习面试的一些心得(非计算机专业)
  16. aws php环境,AWS/CENTOS搭建LAMP环境
  17. 基于网络的思维导图工具的八个独特优点
  18. twitter APi的使用与twitter数据的应用
  19. python 二进制Plist文件转Xml格式Plist
  20. 企业管理系统ERP为什么要上云

热门文章

  1. 传统波束形成的算法实现
  2. 天狮集团李金元大胆决策创业,天狮直销成为中国直销走出去的典范
  3. 程序员找工作有哪些渠道?
  4. BZOJ 4466 [Jsoi2013]超立方体【模拟
  5. mpg123 听音乐
  6. Logic Pro X for Mac(专业音频编辑制作工具)
  7. 高观点下的IEC61499 功能块
  8. ssm框架搭建流程及原理分析
  9. 简单批处理病毒的制作—bat小程序
  10. C++--读取txt文件中的多行数据