BUG-vant在部分Android无法加载图标

407 阅读1分钟

问题

在钉钉中引入vant图标时,发现无法显示加载,PCiOS均正常

排查思路

  1. 检查vanticon加载逻辑,发现为iconfont加载模式
  2. 检查其字体为vant-icon
  3. 检查包中字体加载逻辑,直接定位到vant/es/icon/style/index,发现为woff2字体+base64加载模式
  4. 猜测可能是部分钉钉版本不支持woff2字体导致

解决措施

直接添加woff资源引入

@font-face {
  font-family: vant-icon;
  src: url('//at.alicdn.com/t/c/font_2553510_ciljc7axaw7.woff?t=1705587463221') format('woff');
}

注:该资源为vant的git仓库提供,不保证其实时有效,建议下载后拉取到本地加载

完结撒花