前端项目中有很多地方会用到小图标，阿里的 iconfont 是一个不错的选择，同时， 它上面的 svg 矢量图标占用资源更少加载更快是一个不错的选择， 下面我们就来说一说，项目中如何来使用 svg 图标

安装插件 vite-plugin-svg-icons

npm install vite-plugin-svg-icons -D

vite.config.js 中配置

main.js 中引入svg-icons 组件

以上我们就成功的引入并配置了 svg 图标组件

使用阿里 svg 图标

首先，登录阿里的 iconfont 选择合适的图标文件

在 src/assets/icons 文件夹中 新建文件 phone.svg

一个svg 图标就下载好了

vue 文件中使用

以上就是在vue中使用 svg 图标的配置了