vue中和小程序中使用iconfont

1、vue中使用iconfont

一、百度搜索iconfont或者阿里巴巴矢量图标库官网，注册登陆；
二、找到图标管理->新建项目，或者使用已有的项目，用于保存本身的图标；

三、搜索本身须要的icon；

四、添加到购物车中；

五、购物车中就有了相应icon

六、点击购物车，选择添加至项目。就是咱们刚才建立的项目或者以前已有的项目

七、点击肯定，便可将icon添加到咱们的项目中

八、而后点击个人项目，找到本身的项目，便可看到刚才添加的icon

九、点击下载至本地

十、将下载的压缩包进行解压

十一、打开解压好的文件夹，找到iconfont.css

十二、把解压好的文件夹放入项目目录下，在vue项目中的index.html中引入便可使用
如能够放在public文件夹下

1三、在组件中使用

2、小程序中使用iconfont

前10步同vue中运用步骤
十一、新建assets文件夹，将解压后的每一个文件能够放在assets下面

十二、在全局样式app.wxss中引入iconfont.css文件，这时报错。这是由于小程序只能识别以.wxss结尾的css文件，不能识别标准的.csss文件，因此要将iconfont.css文件名改成iconfont.wxss。

1三、在组件中使用本身须要的iconfont

1四、实如今小程序中使用icon,如图

总结：三步搞定

一、将iconfont下载至本地
二、在项目中引入文件
三、vue中直接使用，而后使用i标签，经过类来规定使用的icon
四、小程序中把iconfont.css的后缀名改成wxss，在项目中直接使用i标签便可