默认字体图标源于uni-icons组件内置的uni.ttf,若未使用则浪费体积并可能与iconfont冲突;需通过搜索引用、检查文件和网络加载确认后,卸载包、删除目录、清理配置及缓存彻底移除。

uni-app 项目里为什么会有默认字体图标?
新初始化的 uni-app 项目(尤其是用 vue-cli 或 HBuilderX 创建的)可能自带 uni-icons 组件,它内部封装了一套字体图标(uni.ttf),并自动注册到全局。这不是“多余文件”,而是 uni-icons 的运行依赖——但如果你根本不用它,这个字体文件就会白占体积、还可能和你引入的 iconfont 冲突(比如同名 font-family: "uniicons" 被覆盖)。
怎么确认并删掉它?
先看是否真被引用了:
- 搜项目里有没有
<uni-icons标签或import uniIcons; - 打开
node_modules/uni-icons,检查是否存在static/fonts/uni.ttf或类似路径; - 在 H5 真机调试时打开 DevTools → Network,过滤
uni.ttf,看是否加载了该字体。
确认没用后,按以下顺序清理:
- 卸载 npm 包:
npm uninstall uni-icons或yarn remove uni-icons; - 删掉
node_modules/uni-icons目录(卸载后一般自动消失,手动确认); - 检查
main.js或App.vue是否有Vue.use(uniIcons)或@import相关样式,删掉; - 搜索整个项目,删掉残留的
uni-icons引用,包括pages.json里的usingComponents配置; - 清空
unpackage/目录,避免旧构建缓存带出字体文件。
删完还要防它偷偷回来
uni-icons 常被模板项目预装,或通过 uni_modules 方式引入。重点检查:
-
uni_modules/uni-icons文件夹是否存在,存在就直接删; -
manifest.json或vue.config.js里有没有配置自动注入图标资源; - HBuilderX 用户注意:新建项目向导里勾选了“启用图标组件”会自动加
uni-icons,下次创建要取消勾选。
删得最干净的方式,是卸载 + 手动删目录 + 清缓存三连,否则某次 npm install 或 HBuilderX 自动同步可能又把它拉回来。


















