[2877] Unknown custom element

Hello I am trying to convert my existing Vuejs app into nuxt.js.

I am using buidcons and those are working in vuejs but with nuxtjs I am getting this error

Vue warn: Unknown custom element: <bi> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

Here is my code

<nuxt-link to="/newuser" @click="leftmenu" class="head">
     <bi class="budicon-cloud-download"> </bi>
</nuxt-link>

This is my buidcons.css file

@font-face {
  font-family: 'budicon-classic';
  src:  url('/static/fonts/Budicons/budicon-classic.eot?jdete2');
  src:  url('/static/fonts/Budicons/budicon-classic.eot?jdete2#iefix') format('embedded-opentype'),
    url('/static/fonts/Budicons/budicon-classic.ttf?jdete2') format('truetype'),
    url('/static/fonts/Budicons/budicon-classic.woff?jdete2') format('woff'),
    url('/static/fonts/Budicons/budicon-classic.svg?jdete2#budicon-classic') format('svg');
  font-weight: normal;
  font-style: normal;
}

bi {
  font-family: 'budicon-classic' !important;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  margin-right: 4px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

Would you please help me how I can solve this