How to use Font-Awesome SVG with Vuetify and Nuxt.js - font-awesome

Question

I am trying to use the Font-Awesome SVG icons with Vuetify. But I don't manage to display icons.
I installed the necessary packages with:
npm install #fortawesome/fontawesome-svg-core #fortawesome/vue-fontawesome #fortawesome/free-solid-svg-icons -D
And the Vuetify plugin file looks like this:
import Vue from 'vue'
import Vuetify from 'vuetify/lib'
import colors from 'vuetify/es5/util/colors'
import { library } from '#fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '#fortawesome/vue-fontawesome'
import { fas } from '#fortawesome/free-solid-svg-icons'
Vue.component('font-awesome-icon', FontAwesomeIcon)
library.add(fas)
Vue.use(Vuetify, {
iconfont: 'faSvg',
theme: {
primary: colors.blue.darken2,
accent: colors.grey.darken3,
secondary: colors.amber.darken3,
info: colors.teal.lighten1,
warning: colors.amber.base,
error: colors.deepOrange.accent4,
success: colors.green.accent3
}
})
Trying to show a icon:
<v-icon color="white" round>fa-times</v-icon>

Answer 1

It's really simple. Nuxt js + Vuetify 2:
npm i -D #fortawesome/fontawesome-free
U can check your package.json file:
"devDependencies": {
"#fortawesome/fontawesome-free": "^5.11.2"
}
In nuxt.config.js file:
vuetify: {
defaultAssets: {icons: 'fa'}
}
That's all! U can use:
<v-icon>fa-times</v-icon>

Answer 2

You should use the icons: { iconfont: 'faSvg' } syntax.
If anyone is using the #nuxtjs/vuetify module, you can configure the iconset in vuetify to use faSvg and then use the fontawesome-module for SVG icons. At this time of writing, vuetify is using the free solid icons in most of its components, so including all solid icons should be enough. You can configure this in the fontawesome-module so:
...otherNuxtConfigStuff,
buildModules: [
...otherBuildModules,
// https://github.com/nuxt-community/fontawesome-module
['#nuxtjs/fontawesome', {
icons: {
solid: true,
// here you can include other icons you need
brands: [
'faYoutube',
'faVimeo',
'faVimeoV'
]
}
}],
// https://github.com/nuxt-community/vuetify-module
['#nuxtjs/vuetify', {
...otherVuetifyConfigStuff,
icons: {
iconfont: 'faSvg'
}
}]
]
}
Make sure you don't change the component option in the fontawesome configuration because vuetify uses the default component name font-awesome-icon.