Let’s create vue application using scaffolding tool vueclic

vue create feather-example
cd feather-example
npm start

The above command create a a vue new application with initial folder structure, installs dependencies and start the server.

There are many ways we can integrate feather-app into vuej application

  • vue-feather
  • vue-icon library
  • cdn javascript url

This tutorials covers an feather-icons tutorials with examples

feather-icons npm library integration example

npm install command install feather-icons library to your application

npm install --save feather-icons

Once feather-icons installed in your application, Next create a vue component icontest.vue

In this component, add feather icon to your component

First import icon from npm library as seen below

import  'feather-icons'

use the icon as seen below. you can customize the icon color and size attributes.

    <i data-feather="calendar"></i>

Here is an vuejs feather icon library integration example

<template>
<template>
  <div>
    <h1> Displaying calendar icon</h1>
    <i data-feather="calendar"></i>
  </div>
</template>


<script>
export default {
  name: 'icontest',
  props: {
    msg: String
  }
}
</script>

<style scoped>

</style>
*/}}