@justeat/f-vue-icons

f-vue-icons

Shared Icon Components for Vue.js.

---

---

Install

Add the module to your project

yarn add @justeat/f-vue-icons

Usage

// Only import what you need!
import { AlertIcon, PaymentAmexIcon, ... } from '@justeat/f-vue-icons'

Within the context of a Vue app, that will look like:

<template>
    <alert-icon />
    <payment-amex-icon />
</template>


<script>
import { AlertIcon, PaymentAmexIcon, ... } from '@justeat/f-vue-icons';

export default {
    components: {
        AlertIcon,
        PaymentAmexIcon
    }
};
</script>

TODO – setup a page with an example of all the icons somewhere – See all icons and usage here: https://f-vue-icons.netlify.com

Tree shaking

By using ES imports like import { AlertIcon } from '@justeat/f-vue-icons' with Webpack v4 or Rollup, unused exports in this module will be automatically eliminated.

If you can't use a tree-shaking compatible build tool, then you can use the per-file icons from icons directory, e.g. import AlertIcon from '@justeat/f-vue-icons/icons/AlertIcon'.

Browser Support

The component extends @justeat/browserslist-config-fozzie package for the list of browsers to support.

Building the Module

Run yarn build to compile the module.

Running the Tests

Run yarn test to run the tests.

Credits

This package was heavily inspired by the excellent vue-feather-icons package.