uni-app 阿里图标库引用图标不显示
uni-app 阿里图标库引用图标不显示
| 项目信息 | 详情 |
|---|---|
| 产品分类 | uniapp/App |
| PC开发环境 | Windows |
| PC开发环境版本 | win 10 |
| HBuilderX类型 | 正式 |
| HBuilderX版本 | 3.1.14 |
| 手机系统 | iOS |
| 手机系统版本 | IOS 14 |
| 手机厂商 | 苹果 |
| 手机机型 | iphone8 |
| 页面类型 | vue |
| 打包方式 | 云端 |
| 项目创建方式 | HBuilderX |
操作步骤:
1
预期结果:
1
实际结果:
1
bug描述:
阿里图标库最近更新了 下载到本地之后引用图标不显示

更多关于uni-app 阿里图标库引用图标不显示的实战教程也可以访问 https://www.itying.com/category-93-b0.html
1 回复
更多关于uni-app 阿里图标库引用图标不显示的实战教程也可以访问 https://www.itying.com/category-93-b0.html
阿里图标库近期更新后,图标不显示的问题通常与图标引用方式或字体文件路径有关。以下是常见解决方案:
-
检查字体文件路径
确保iconfont.css中的url()路径正确指向字体文件(如.woff2、.ttf)。若文件位于static目录,使用绝对路径:[@font-face](/user/font-face) { src: url('/static/font/iconfont.woff2') format('woff2'); } -
更新图标引用方式
阿里图标库新版可能调整了字体编码。在 CSS 中确认图标类名对应的 Unicode 编码,例如:.icon-xxx:before { content: "\e001"; /* 与项目下载的 CSS 文件保持一致 */ }

