资讯专栏INFORMATION COLUMN

react-webpack工程中怎么使用iconfont图标

iOS122 / 3080人阅读

摘要:更新现在如果使用新版本作为框架的话图标已经和打通随意使用了打包那里要添加如下代码这个是告诉要打包什么类型的文件进入到官网这个页面左侧选择中间那个之后点击下载到本地下载后解压缩到项目工程某一个你觉得的目录下不用拷贝再你想引用的组件中引用他

2018-9-17更新:现在如果使用新版本antd作为UI框架的话 icon图标已经和iconfont打通随意使用了

1、webpack打包那里要添加如下代码:(这个是告诉webpack要打包什么类型的文件)


2、进入到iconfont官网这个页面 左侧选择中间那个 之后点击下载到本地

3、下载后解压缩到项目工程某一个你觉得ok的目录下(demo不用拷贝)

4、再你想引用的react组件中引用他,只需要引用iconfont.css文件

require("../../../public/css/icon-extend/iconfont.css");

5、正常使用就ok了

主要参考文章:

https://www.cnblogs.com/Nick-...

http://react-china.org/t/reac...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89733.html

相关文章

  • [聊一聊系列]聊一聊iconfont那些事儿

    摘要:欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面不仅仅是代码从说起要想了解,得从一个新的规则说起。因为用户没有安装的话,我们强制要求显示也没有办法。国内有阿里巴巴的平台,可以选自己喜欢的图标导出。 欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面(不仅仅是代码):https://segmentfault.com/blog/fr...

    Markxu 评论0 收藏0
  • [聊一聊系列]聊一聊iconfont那些事儿

    摘要:欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面不仅仅是代码从说起要想了解,得从一个新的规则说起。因为用户没有安装的话,我们强制要求显示也没有办法。国内有阿里巴巴的平台,可以选自己喜欢的图标导出。 欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面(不仅仅是代码):https://segmentfault.com/blog/fr...

    2501207950 评论0 收藏0
  • [聊一聊系列]聊一聊iconfont那些事儿

    摘要:欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面不仅仅是代码从说起要想了解,得从一个新的规则说起。因为用户没有安装的话,我们强制要求显示也没有办法。国内有阿里巴巴的平台,可以选自己喜欢的图标导出。 欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面(不仅仅是代码):https://segmentfault.com/blog/fr...

    Shisui 评论0 收藏0
  • 我的前端规范系列-图标工程化[好用的图标]

    摘要:能快速修改和得到想要的图标图标命名规范化后编程人员可以很快配合找到想要的图标。图标设计规范图标要有重心根据不同的图标形状类型使用不同的轮廓线,可以使图标之间保持一致的视觉效果。 为什么要有图标规范 1.文字和图标能更好的搭配使用图标是具有指代意义的图形,也是一种标识,即文字的一种延展,实际应用中也常与文字一起配合使用,按字体标准规范化设计的图标更容易对齐。2.图标适配变得更简单,图标风...

    shengguo 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<