微信小程序引入阿里巴巴彩色图标字体（Symbol）

步骤一：在微信小程序开发者工具的工作的根目录打开cmd，输入

npm install mini-program-iconfont-cli --save-dev

步骤二：输入命令，生成iconfont.json文件

npx iconfont-init

步骤三：将彩色图标添加入购物车，然后添加至你的项目

步骤四：更新代码后复制粘贴到iconfont.json的"symbol_url"

步骤五:iconfont.json:

{
    "symbol_url": "//at.alicdn.com/t/font_2891912_m2ov2xg8c2p.js",
    "save_dir": "./iconfont",
    "use_rpx": false,
    "trim_icon_prefix": "icon",
    "default_icon_size": 18
}

步骤六：输入命令生成icon文件夹（当你的阿里巴巴图标库中添加进新图标时，每次必须更新代码
js，修改iconfont.json的"symbol_url"，并且重复执行步骤六）

npx iconfont-wechat

步骤七：app.json中引入iconfont组件

{
  "usingComponents": {
    "iconfont": "/iconfont/iconfont"
  },

步骤八：在你需要的页面的wxml中引入彩色图标（name为图标字体库中的Font Class / Symbol，其中class属性可以自己修改样式）

<iconfont size="22" name="wangguan" class="icon"></iconfont>

效果图：