VUE3图标库引入

1. 进入iconfont图标库 把要用的图标加入购物车 添加至我的项目

2. 下载至本地 然后把下载的文件拉至项目中

3. 封装 IconFontSymbol.vue（彩色的图标）和IconFont.vue（黑白的图标）

<template>
  <svg class="iconfont-svg" :style="iconStyle" aria-hidden="true">
    <use :xlink:href="`#${icon || ''}`" />
  </svg>
</template>

<script>
// import "./../iconfonts/iconfont.css";
import "./../iconfonts/iconfont.js";

export default {

      name: "IconFontSymbol",

      props: ["iconStyle", "icon"],

};

</script>

<template>
  <i
    :class="`iconfont ${icon || ''} ${iconClass || ''}`"
    :style="iconStyle"
  ></i>
</template>

<script>
import "./../iconfonts/iconfont.css";
// import "./../iconfonts/iconfont.js";

export default { name: "IconFont", props: ["icon", "iconStyle", "iconClass"], };

</script>

4.在页面中引入 注册 调用