1. 安装依赖

npm i -D @iconify/json

npm i --save-dev @iconify/vue

2. 组件封装

src/components/S-icon.vue

<script setup lang="ts">
// 搜索图标 https://icon-sets.iconify.design/
import { Icon } from '@iconify/vue'
defineProps({icon: {type: String,required: true}
})
</script><template><Icon :icon="icon" />
</template>

3. 页面使用

<S-icon icon="icon-park:moon" />

搜索目标图标

打开官网 https://icon-sets.iconify.design/

输入英文关键字进行搜索

点击目标图标，复制图标名称即可