pz-icon-vue v0.4.1

PZ Icon Vue

This Vue-based component allows you to use a series of icons from font awesome easily.

Pre-requirements

To use pz-icon-vue it is necessary to have Vue installed (version 3 is recommended) in the project to deploy this component.

To use pz-upload-file-vue it is necessary to have Tailwind installed in the project to implement this component.

Enabling JIT mode

To enable just-in-time mode, set the mode option to 'jit' in your tailwind.config.js file:

// tailwind.config.js
module.exports = {

mode: 'jit',
purge: [
    // ...
],
theme: {
    // ...
}
// ...
}

Purge CSS

To get started, provide an array of paths to all of your template files using the purge option:

// tailwind.config.js
module.exports = {
  purge: [
    './node_modules/pz-icon-vue/**/*.vue',
  ],
  theme: {},
  variants: {},
  plugins: [],
}

NPM Cache (optional)

This command should only be executed if the component is not compiling properly.

npm cache clean --force

Installation

This is the way to install using npm pz-icon-vue in our project.

npm i pz-icon-vue@latest

Importing

This is the way to import pz-icon-vue into our project.

import PZIconVue from 'pz-icon-vue'

Usage

Simple example

This is a simple example where two parameters are sent to the component for use.

• {'icon-type'} - used to assign the type of icon.
• {'icon-name'} - used to assign the icon name.

<template>
    <PZIconVue :icon="[{'icon-type'}, {'icon-name'}]" />
</template>

Example:

<template>
    <PZIconVue :icon="['fas', 'home']" />
</template>

<style scoped>

</style>

<script>
import PZIconVue from 'pz-icon-vue'

export default {
    components: {
        PZIconVue
    }
}
</script>

Authors

Team working on the development of pz-icon-vue.

• PONZACENIO | Web developer

License

pz-icon-vue is ISC licensed.