微信小程序引入阿里巴巴icon步骤及报错解决

首先将选择好的图标加入购物车,点击右上角购物车图标，将其添加进项目中。(Add To Project)

添加进入项目后，会自动跳转到该项目，选择Download Code，

解压缩包，只会用到文件夹中的4个文件，将解压后的下面4个文件放到小程序项目中

 记得要将iconfont.css后缀改为wxss

 在miniprogram中新建一个文件夹iconfont，将上述4个文件拖拽到文件夹iconfont中

 然后，在app.wxss中引入

@import "./iconfont/iconfont.wxss";

 根据先前下载好的字体文件夹，找到demo_index.html文件，进入该网页，查看所有icon的名字

 然后，在wxml中以如下格式引用，标签不唯一

<text class='iconfont icon-nan'></text>

 此时会开发者工具会报错

解决方法就是在iconfont.wxss中，将如下代码路径改变一下

更改前

 更改后，注意要与先前新建的文件夹名称一致

 最后，icon就显示出来了