Uni-App nvue 如何使用 iconfont

第一步:iconfont.cn官网创建我的项目

2025-12-14T12:43:46.png

第二步:下载ttf文件保存到项目static目录下

2025-12-14T12:34:57.png

第三步:在app.vue中onLaunch()函数载入字体

    // #ifdef APP
    const domModule = uni.requireNativePlugin('dom')
    domModule.addRule('fontFace', {
        fontFamily: 'iconfont-demo',
        src: "url('/static/iconfont/iconfont-demo.ttf')",
    })
    // #endif

第四步:使用图标

<text class="iconfont-demo">&#xe629;</text>
.iconfont-demo {
        font-family: iconfont-demo
        // 一定不要加引号
}

标签: Uni-App, nvue, iconfont

添加新评论