iconPark的简单使用

前言

iconPark图标，字节跳动推出的一款支持Vue、React、Svg的开源图标库，图标种类丰富，也支持多种图片类型下载。也可直接在官网生成相应的Vue、React图标代码在项目中使用即可。eg：vue3为例

安装

Vue2.x: npm i @icon-park/vue --save
Vue3.x: npm i @icon-park/vue-next --save
React: npm i @icon-park/react --save
Svg: npm i @icon-park/svg --save

使用

main.js 文件引入样式

import ‘@icon-park/vue-next/styles/index.css’;

全局安装

import {install} from '@icon-park/vue-next/es/all';
import {createApp} from 'vue';

const app = createApp({});

install(app); // 代码使用 h-edit
install(app, 'h'); // 自定义前缀 h-edit

app.mount('#app');

局部引用

<template>
    <component :is="Home" :size="size" :fill="fills"/>
</template>
<script>
import {Home} from '@icon-park/vue-next;
</script>