Vue3 SVG icon components integrated from @aplus-frontend/icon
can be imported like a component. try it now 🎉
pnpm add @aplus-frontend/icon -w
First, you should add the icons that you need into the library. After that, you can use icons in your Vue components as simply as this:
import { IconApOrder } from '@aplus-frontend/icon';
<template>
<IconApOrder />
</template>;
Style properties of icon, like fontSize and color
import { IconApOrder,IconApageWaitstatus } from '@aplus-frontend/icon';
<template>
<IconApOrder :style="{ fontSize: '40px', color: '#fff' }" />
<!--rotate icon-->
<IconApageWaitstatus
:style="{
fontSize: '70px',
color: '#fff',
transform: 'rotate(30deg)'
}"
/>
</template>;
You can see more detail in the document
//or you can import all of the icons
import icons from '@aplus-frontend/icon';
pnpm run build:icons # Build library