iconfont无法正常显示,只有一个正方形图标

来源:7-4 使用 iconfont 嵌入头部图标

DKMINI

2018-10-30

图片描述
图片描述
图片描述
图片描述
老师这是我的代码,iconfont无法正常显示,只能显示一个小长方形。好急好急

写回答

5回答

pzd88

2018-11-09

我今天也遇到了类似问题,已解决,大概方法是这样的:

第一个原因是styled-components版本问题,看了一下,到v4的版本后,injectGlobal改成了"createGlobalStyle",看到题主也这样改了,并且 export 出来

第二个是去使用,我在项目里把对iconfont的使用,放到了“App.js”里,大概如下:


//img.mukewang.com/szimg/5be5a9d80001a1bb11800752.jpg

之后在"common/header/index.js"文件里直接使用"<i className='iconfont'>&....;</i>"就可以正常显示了。


不知道能不能解决你的问题?

14
8
厉害的乌废猫
大神厉害,解决了方块问题。这个styled-components很不方便啊
2019-09-30
共8条回复

DonkeyBird

2019-05-16

//img.mukewang.com/szimg/5cdd3fa50001baa304720218.jpg

默认下载的有括号是(.iconfont)要将括号去掉//img.mukewang.com/szimg/5cdd400c0001a4a910540497.jpg

将这个组件导入app.js中

//img.mukewang.com/szimg/5cdd4085000156bd06800464.jpg

最后就可以显示了,到处是坑,哎

1
0

拉莱耶的猫

2018-12-07

font-class形式不行呀

0
0

慕先生7114965

2018-11-06

同款错误~~

0
0

DKMINI

提问者

2018-10-30

//img.mukewang.com/szimg/5bd849aa0001e85903230516.jpg

这是我的package.json文件,是不是因为依赖包的版本太高了,我也搞不懂,弄了好久都不行,但是下载了老师你的代码就可以打开。我对比了下,没有差别的。很奇怪

0
4
聆空
哦哦 可以了 我之前把svg的字体注释掉了。
2018-11-24
共4条回复

React零基础入门到实战,完成企业级项目简书网站开发

主流新技术 React-redux,React-router4,贯穿基础语法

5275 学习 · 2496 问题

查看课程