How to use these icons in buefy components?

[slidenerd]

• Take a buefy component like input
• It has the option to set an icon to it
• How do I use these icons in place of those as they dont render currently EDIT 1 Codesandbox illustrating my problem

[slidenerd]

Thanks I figured it out

/**
 * https://stackoverflow.com/questions/67761723/how-to-use-nuxtjs-fontawesome-icons-in-buefy
 */
import Vue from 'vue'
import { library } from '@fortawesome/fontawesome-svg-core' // import the mandatory

import {
  faAngleLeft,
  faAngleRight,
  faArrowDown,
  faArrowUp,
  faBullhorn,
  faChartLine,
  faCheck,
  faClipboardList,
  faExclamationCircle,
  faEye,
  faEyeSlash,
  faPlus,
  faSearch,
  faTimes,
  faTrash,
  faUnlock,
  faUser,
  faUsers,
} from '@fortawesome/free-solid-svg-icons' // import the icons that you've choosen, VScode may suggest the import for you!

import {
  faFacebook,
  faGoogle,
  faGithub,
  faReddit,
  faTwitter,
} from '@fortawesome/free-brands-svg-icons'

import Buefy, { // import Buefy, required
  Field,
  Input, // import the component that you want to use
} from 'buefy'

import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' // import the icon component for Buefy

library.add(
  faAngleLeft,
  faAngleRight,
  faArrowDown,
  faArrowUp,
  faBullhorn,
  faChartLine,
  faCheck,
  faClipboardList,
  faExclamationCircle,
  faEye,
  faEyeSlash,
  faFacebook,
  faGoogle,
  faGithub,
  faPlus,
  faReddit,
  faSearch,
  faTimes,
  faTrash,
  faTwitter,
  faUnlock,
  faUser,
  faUsers
) // add the icons you've selected
Vue.component('FontAwesomeIcon', FontAwesomeIcon) // tell Vue to use the icon component

Vue.use(Field)
Vue.use(Input) // same goes for the Dropdown
Vue.use(Buefy, {
  defaultIconComponent: 'font-awesome-icon', // the icon component that we are using
  defaultIconPack: 'fas', // the pack given by Fontawesome
})