美文网首页
UI提供的icon文件如何引用到项目

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

作者: 懿左左 | 来源:发表于2019-01-28 11:43 被阅读0次

    关于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同样是这个步骤。)

    相关文章

      网友评论

          本文标题:UI提供的icon文件如何引用到项目

          本文链接:https://www.haomeiwen.com/subject/devmjqtx.html