UI提供的icon文件如何引用到项目

关于UI提供的icon文件如何引用到vue+elementui项目中

一、找到UI提供的icon文件
  找到包含下图文件的文件夹

微信截图_20190128105230.png

二、引入到vue+elementui项目中

1、fonts文件
  打开fonts文件夹如下图所示

微信截图_20190128110355.png

  接着将fonts里的所有文件复制粘贴到项目里的assets/fonts中,如果assets没有fonts文件就新建一个再粘贴进去,如下图所示
微信截图_20190128110851.png

2、css样式
  UI提供的icon文件夹中有个style.css层叠样式文档(我说的这个style.css只是我们UI提供的,可能有的命名不是style.css, 类似命名xxx.css)。
  然后将这个style.css样式中的样式依然复制粘贴到项目里的assets/sass/xxx.scss中,如果assets没有sass文件就新建一个sass文件,为了文件的以后管理及维护,需要在sass文件中再新建一个icons.scss文件之后再粘贴进去(这边我是命名为icons.scss文件)如下图所示

微信截图_20190128112400.png

  (这次我项目中引用的是scss,不过less引用icon同样是这个步骤。)

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,969评论 1 45
  • 1、LESS的官网:http://lesscss.org 2、Sass官网地址:http://sass-lang....
    Howie223阅读 9,160评论 0 5
  • 想想学习Sass时间也有差不多一年的光景了。在这一年来的时间中,在GitHub不断阅读Sass相关的源码。也在国外...
    小豌豆书吧阅读 12,027评论 1 24
  • 白兰在母亲去世后,孤身一人去韩国找姨妈,然而她姨妈全家移民加拿大,没有一个亲人的白兰选择留在韩国,但是签证到期后她...
    timdk阅读 4,870评论 0 0
  • 入选时间:2017年04月11日 入选级别:第七层融会贯通 入选理由:绯雪千叶,男,1984年出生,他性格开朗,喜...
    周助人阅读 2,299评论 0 0