uni-app引入自定义图标后报错

最新推荐文章于 2024-09-11 18:08:20 发布

ljw@lq

最新推荐文章于 2024-09-11 18:08:20 发布

阅读量2.6k

点赞数 1

分类专栏： uniapp 文章标签： vue.js uni-app

本文链接：https://blog.csdn.net/Shiny_boy_/article/details/122690213

版权

uniapp 专栏收录该内容

16 篇文章 1 订阅

订阅专栏

uni-app引入自定义图标后报错

按照uni-app官网https://uniapp.dcloud.io/component/uniui/uni-icons引入自定义图标后，报错信息如下：

18:23:01.393 Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
18:23:01.395 ModuleNotFoundError: Module not found: Error: Can't resolve './iconfont.ttf?t=1643100394872' in 'E:\project\patrol_system'
18:23:01.395     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\webpack\lib\Compilation.js:925:10
18:23:01.397     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\webpack\lib\NormalModuleFactory.js:401:22
18:23:01.397     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\webpack\lib\NormalModuleFactory.js:130:21
18:23:01.399     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\webpack\lib\NormalModuleFactory.js:224:22
18:23:01.399     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\neo-async\async.js:2830:7
18:23:01.400     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\neo-async\async.js:6877:13
18:23:01.400     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\webpack\lib\NormalModuleFactory.js:214:25
18:23:01.400     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\enhanced-resolve\lib\Resolver.js:213:14
18:23:01.405     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\enhanced-resolve\lib\Resolver.js:285:5
18:23:01.405     at eval (eval at create (D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:13:1)
18:23:01.407     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\enhanced-resolve\lib\UnsafeCachePlugin.js:44:7
18:23:01.407     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\enhanced-resolve\lib\Resolver.js:285:5
18:23:01.407     at eval (eval at create (D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:13:1)
18:23:01.407     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\enhanced-resolve\lib\Resolver.js:285:5
18:23:01.407     at eval (eval at create (D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:25:1)
18:23:01.415     at D:\software\executepackage\HBuilderX.3.2.9.20210927\HBuilderX\plugins\uniapp-cli\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:67:43

解决：
修改iconfont.css中src的引用路径如下（改成了绝对路径）：

@font-face {
  font-family: "iconfont";
  src: url('~@/static/iconfont.ttf?t=1643100394872') format('truetype');
}