1. Abra el sitio web oficial iconfont Alibaba https://www.iconfont.cn
2. Nuevo proyecto (esto es conveniente para el mantenimiento posterior de la biblioteca de iconos)
image.png
3. Agregue los íconos requeridos al carrito de compras
image.png
4. Abra el carrito de compras y seleccione agregar al artículo, luego OK
image.png
5. En este momento, puede ver el icono de svg que seleccionó en el proyecto. En este momento, puede hacer clic para descargarlo en el sitio
image.png
6. Abra el paquete zip descargado, puede ver los archivos dentro, saque los siguientes archivos
image.png
7. Cree una carpeta de iconos debajo de la carpeta vue assets y coloque los archivos extraídos en esta carpeta
8. Introduzca import './assets/icon/iconfont.css' en main.js para que pueda usar el icono de svg que descargó en el proyecto vue
9. En vue, puede escribir <span class = "icon iconfont icon-right"> </ span> para mostrar el icono iconfont normalmente. Solo necesita modificar la clase icon-right al modificarlo. El nombre de la clase puede estar en ver en clase de fuente
Si desea agregar imágenes más tarde, cópielas en iconfont.css y agréguelas al proyecto
Cada vez que agregue un icono, debe sobrescribir el archivo de recursos
