在vue项目中如何使用字体图标

先在 https://www.iconfont.cn 阿里巴巴矢量图标库 下载svg图标后

在 https://icomoon.io/app/#/select 中 新建集合

在新建集合中导入图标

点击Generate Font 生成字体图标并下载

解压后将style.css 重命名为 icon.css。

在vue项目中的assets文件夹中新建styles文件夹，将下载的icon.css和fonts放入styles文件夹中。

在main.js中导入字体图标。

import './assets/styles/icon.css'

使用字体图标。

<span class="icon-bookmark"></span>

效果