uniapp 中使用 iconfont

uniapp 中使用彩色的 iconfont

1、在自己图标库项目中下载到本地：

 2、解压

 3、shift+右键 打开powershell 窗口 执行一下代码

npm install -g iconfont-tools

 4、在步骤2解压的文件中 执行命令行 （shift+右键 打开powershell 窗口 也行）

iconfont-tools

按一下操作

 5、目录会多了个iconfont-weapp文件

 进入文件把 iconfont-weapp-icon.css复制到 static 文件中

 6、在app.vue中导入

@import './static/css/iconfont-weapp-icon.css';

7、使用格式

<view class="t-icon t-icon-shijian"></view>

 t-icon开头 接图标的类名

iconfont-weapp-icon.css中查看类

上半部分引用于 uniapp 中使用彩色的 iconfont - 京鸿一瞥 - 博客园 (cnblogs.com)

非彩色的

一、Unicode 引用（Unicode 是字体在网页端最原始的应用方式）        

        特点：

                （1）支持按字体的方式去动态调整图标大小，颜色等等；

                （2）默认情况下不支持多色，直接添加多色图标会自动去色。

        使用步骤如下：

下载的源代码放到 static/icon目录下

二、APP.VUE 页面添加引用

三、修改为正确的引用文件夹

页面中就可以写iconfont icon-home来引用图标，style来更改大小。

<i class="iconfont icon-home" style="font-size: 100upx;"></i>

猫猫的心里话

加菲猫的VFP|狐友会社群接收投稿啦

加菲猫的VFP，用VFP不局限VFP，用VFP混合一切。无论是VFP，还是JS，还是C，只要能混合起来，都可以发表。

商业模式，销售技巧、需求规划、产品设计的知识通通可以发表。

暂定千字50元红包，，优秀的文章红包更大，一经发表，红包到手。

如何帮助使用VFP的人？

用VFP的人，有专业的，有非专业了，很多人其实是小白，问出的问题是小白，如果问题不对，我们引导他们问正确的问题。无论如何请不要嘲笑他们说帮助都不看，这么简单的问题都不会，嘲笑别人不行，而无法提出建设性答案，是很low的。

我们无论工作需要，还是有自己的软件，都是是需要真正的知识，如何让更多人学习真正的VFP知识呢，只需要点赞，在看，能转发朋友圈就更好了。

加菲猫的vfp倡导用"VFP极简混合开发，少写代码、快速出活，用VFP，但不局限于VFP，各种语言混合开发"。

我已经带领一百多名会员成功掌到VFP的黑科技，进入了移动互联网时代，接下来我们要进入物联网领域。

2023年狐友会社群会员继续招募中

社群会员获取的权益有：

祺佑三层开发框架商业版（猫框），终身免费升级，终身技术支持。

开放的录播课程有：

微信小程序，微信公众号开发，H5 APP开发，Extjs BS开发，VFP面向对象进阶，VFP中间层开发。

源码类资源有：

支付组件源码，短信源码，权限组件源码，一些完整系统的源码。这个可以单独出售的，需要的可以联系我。

会员也可以实现群内资源对接，可以接分包，合作等各项商业或技术业务