unocss+iconify技术在vue项目中使用20000+的图标

安装依赖

npm i unocss @iconify/json

配置依赖

vue.config.js文件

uno.config.js文件

main.js文件

使用

html 复制代码
<i class="i-fa:user"></i>
<i class="i-fa:key"></i>

class名是 i- 开头,跟库名:图标名,那都有什么库?什么图标?

https://icones.js.org/

找几个看看


记得加 i-
i-库名:图标名

效果

看,是异步加载svg的图标

相关推荐
一生为追梦37 分钟前
Linux 内存管理机制概述
前端·chrome
喝旺仔la1 小时前
使用vue创建项目
前端·javascript·vue.js
心.c1 小时前
植物大战僵尸【源代码分享+核心思路讲解】
前端·javascript·css·数据结构·游戏·html
喝旺仔la1 小时前
Element Plus中button按钮相关大全
前端·javascript·vue.js
计算机学姐1 小时前
基于SpringBoot+Vue的高校门禁管理系统
java·vue.js·spring boot·后端·spring·intellij-idea·mybatis
柒@宝儿姐1 小时前
Git的下载与安装
前端·javascript·vue.js·git·elementui·visual studio
Hiweir ·2 小时前
机器翻译之数据处理
前端·人工智能·python·rnn·自然语言处理·nlp·机器翻译
敲敲敲敲暴你脑袋2 小时前
【cesium】绘制贴地线面和自定义Primitive
javascript·webgl·cesium
曈欣2 小时前
vue 中属性值上变量和字符串怎么拼接
前端·javascript·vue.js
计算机学姐3 小时前
基于SpringBoot+Vue的宠物医院管理系统
java·vue.js·spring boot·后端·mysql·intellij-idea·mybatis