为了账号安全,请及时绑定邮箱和手机立即绑定

为什么我设置打包之后,字体图标出现一个文件夹后,还会单独出现在dist文件夹下,而且,我的字体图标出不来了

http://img1.sycdn.imooc.com/6264f9cf000198ca13650787.jpg

http://img1.sycdn.imooc.com/6264fa27000126b514030964.jpg

老师,我按照您的设置后,启动和打包字体图标都有问题,这是什么原因呢



自己提的问题自己回答竟然看不到,也是醉了

两个问题都解决了,方案如下:

webpack5配置字体图标版本不同,配置如下https://www.csdn.net/tags/MtTaQg3sMTYyNTEtYmxvZwO0O0OO0O0O.html


字体图标不显示的问题可能是因为字体库的css不同吧(猜想的,因为我的样式和老师版本的样式不太一样)

字体图标样式

@font-face {

  font-family: "iconfont"; /* Project id 3349321 */

  src: url('./iconfont/iconfont.woff2?t=1650592189509') format('woff2'),

       url('./iconfont/iconfont.woff?t=1650592189509') format('woff'),

       url('./iconfont/iconfont.ttf?t=1650592189509') format('truetype');

}


webpack中配置如下

      {

        test:/\.(woff2|woff|truetype)$/,

        use:['file-loader']

      },


好像是必须和format中的值一致,才可以出现,反正我这样设置就ok,网上没找原因,如果有知道的大佬希望告诉我下

正在回答

2 回答

楼主找到解决办法了吗?

0 回复 有任何疑惑可以回复我~
#1

希望林柚一健康快乐成长 提问者

解决了,我写解决方案在提问里,你看不到吗
2022-05-30 回复 有任何疑惑可以回复我~
#2

weixin_慕斯卡7586958 回复 希望林柚一健康快乐成长 提问者

谢谢你 我按照你的写法我也解决了
2023-12-11 回复 有任何疑惑可以回复我~

两个问题都解决了,我的webpack是版本5,版本5的webpack打包字体图标方式如下:https://www.csdn.net/tags/MtTaQg3sMTYyNTEtYmxvZwO0O0OO0O0O.html,此配置后dist文件中不会再dist出现多余字体图标文件,而是只用一个font文件夹包裹着的

 为什么按照老师的配置文件字体图标不出现,老师配置的是后缀名,但是我配置后缀名不出现,也可能是字体图标发生了改变,而是需要配置样式文件当中的format()中的后缀名,就可以正常出现

@font-face {

  font-family: "iconfont"; /* Project id 3349321 */

  src: url('./iconfont/iconfont.woff2?t=1650592189509') format('woff2'),

       url('./iconfont/iconfont.woff?t=1650592189509') format('woff'),

       url('./iconfont/iconfont.ttf?t=1650592189509') format('truetype');

}

配置如下:

      {

        test:/\.(woff2|woff|truetype)$/,

        use:['file-loader']

      },


0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

为什么我设置打包之后,字体图标出现一个文件夹后,还会单独出现在dist文件夹下,而且,我的字体图标出不来了

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信