uniapp 使用iconfont

问题描述:在开发过程中会遇到使用自定义icon的情况,在uniapp项目中使用iconfont步骤如下。

问题解决

步骤一:

打开iconfont网址------我的项目-----下载至本地

uniapp 使用iconfont_第1张图片

下载成功的文件内容:

uniapp 使用iconfont_第2张图片

 步骤二:

以管理员身份运行终端,找到该文件夹下

uniapp 使用iconfont_第3张图片

步骤三:

安装iconfont-tools:npm i -g iconfont-tools

uniapp 使用iconfont_第4张图片

步骤四:

调用iconfont-tools

uniapp 使用iconfont_第5张图片

 执行后的文件夹

uniapp 使用iconfont_第6张图片

步骤五:

将文件复制到uniapp的静态文件夹下

uniapp 使用iconfont_第7张图片

步骤六:

在app.vuez中引用css文件,文件地址为步骤五圈出的地址

uniapp 使用iconfont_第8张图片

步骤七:

调用icon

t-icon-theme-light ">

uniapp 使用iconfont_第9张图片

 综上,iconfont配置及使用完成。

你可能感兴趣的:(uni-app,前端)