antd的iconfont之坑

antd 的 iconfont 之坑

最近几天被坑惨了,一直在研究,本地 icon 可以显示,推到测试环境 icon 就不显示的问题

我们从 iconfont 里面引入自己的一套图标库,把 class 前缀设置为了 anticon,以前一直都没问题的,这几天突然测试环境不显示 icon 了

看测试环境,network 里面字体文件也是加载了的,好奇为何样式不生效

结果发现,本地是生效了这样的样式

1
2
3
4
.anticon:before {
display: block;
font-family: "anticon" !important;
}

而测试环境是生效了这样的样式

1
2
3
.anticon:before {
display: none;
}

去看了一下,在antd/lib/style/mixins下面,是写的display:none;

目前简单粗暴的办法就是在我们的 main.less 里直接把 anticon 的 before 做display:block了,因为我们菜单不需要折叠,所以是可以解决问题的,还不知道以后有没有什么问题,后面再仔细研究一下为什么会这样

如果内容对您有帮助,不妨请作者喝杯咖啡