Answer a question

Hopefully someone will know where I have gone wrong here - I'm trying to implement the Font Awesome package with Vuetify. Font Awesome is all imported and ready to go (setup is indentical to projects which I have Font Awesome successfully integrated):

My bare basics main.js file:

import '@babel/polyfill'
import Vue from 'vue'
import './plugins/vuetify'
import App from './App.vue'
import store from './store'
import './registerServiceWorker'

import { library } from '@fortawesome/fontawesome-svg-core'
import { faCode } from '@fortawesome/pro-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'

library.add(faCode)

Vue.component('font-awesome-icon', FontAwesomeIcon)

Vue.config.productionTip = false

new Vue({
  store,
  render: h => h(App)
}).$mount('#app')

And within a component I am referencing an icon as follows:

My Component.vue:

<template>
    ...
    <v-btn>
        <v-icon>fas fa-code</v-icon>
    </v-btn>
    ...
</template>

^ Where I have left out superfluous code*.

So, my question is - how do we integrate Font Awesome within Vuetify's v-icon component?

For reference, I’m using what is outlined here:

https://vuetifyjs.com/en/components/icons

Which is identical to what I have prescribed above, but sadly my icon does not display...

Update: I specifically want a solution which doesn't include adding the rather heavy Font Awesome all.css file (<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">) - instead importing on an icon by icon need. (the overall weight of the minified all.css file is 52kb in v.5.2.0.

Answers

Ok, so using the above commenter's suggestion, I have managed to get it working by using the standard vue-font-awesome method of including font awesome icon components, swopping <v-icon> out for such that what I used in my question:

<v-btn>
   <v-icon>fas fa-code</v-icon>
</v-btn>

...becomes:

<v-btn fab dark small color="black" v-on:click="addCodeBlock">
   <font-awesome-icon :icon="['fas', 'code']"/>
</v-btn>