1.0.1 • Published 4 years ago
@zlab-de/zel-vue-icons v1.0.1
Zeppelin Element Library Vue Component Icons: @zlab-de/zel-vue-icons
A vue icon component library that was generated using Carbon Design System build files.
Getting started
yarn add @zlab-de/zel-vue-icons
Usage
Method 1: global
You can install these components two ways. The first is to install them when you're initializing your Vue app. For example:
import { ZelVueIcons } from '@zlab-de/zel-vue-icons';
import ZepiconsCart from '@zlab-de/zel-rvue-icons/ZepiconsCart';
import Vue from 'vue';
import App from './App.vue';
Vue.use(ZelVueIcons, {
components: {
ZepiconsCart,
},
});
new Vue({
render: h => h(App),
}).$mount('#app');
Using ZelVueIcons
we can pass in any of the icon components that we'd like to
use. In our application, we can then use them by doing:
<template>
<ZepiconsCart />
</template>
Method 2: local
import ZepiconsCart from '@zlab-de/zel-vue-icons/ZepiconsCart';
export default {
name: 'MyComponent',
component: {
ZepiconsCart,
},
};
<template>
<ZepiconsCart aria-label="cart" class="custom-class" v-on:click="handler" />
</template>
To make new components
Add all svgs to svg folder in icons and then run build. Next run build in icons-vue. To make the npm package a bit nicer, the folders esm, lib, package.json and README.md are copied to a build folder and npm is published from there.