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的图标

相关推荐
beckyye7 分钟前
ant design vue Table根据数据合并单元格
前端·antd
布列瑟农的星空11 分钟前
还在手动翻译国际化词条?AST解析+AI翻译实现一键替换
前端·后端·ai编程
土豆125025 分钟前
Rust 错误处理完全指南:从入门到精通
前端·rust·编程语言
QT 小鲜肉43 分钟前
【Linux命令大全】001.文件管理之mmove命令(实操篇)
linux·服务器·前端·chrome·笔记
前端开发爱好者1 小时前
VSCode 重磅更新!要收费了?
前端·javascript·visual studio code
烛阴1 小时前
C# 正则表达式(4):分支与回溯引用
前端·正则表达式·c#
wuhen_n2 小时前
LeetCode -- 1:两数之和(简单)
javascript·算法·leetcode·职场和发展
曹牧2 小时前
Java:Assert.isTrue()
java·前端·数据库
脾气有点小暴2 小时前
uniapp自定义头部导航
前端·uni-app
假装我不帅2 小时前
jquery.nicescroll使用
前端·javascript·jquery