Utilizing both Vuetify and font-awesome icons has been a successful combination for my project. However, I am facing an issue where the 'fa-folders' icon is not displaying as expected:
In the .ts file:
import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import { fas } from '@fortawesome/free-solid-svg-icons'
import { far } from '@fortawesome/free-regular-svg-icons'
Vue.component('icon-fa', FontAwesomeIcon)
//@ts-ignore
library.add(fas, far)
In the .vue file:
<icon-fa
style="font-size: 19px;"
v-on="on"
:icon="['fas','fa-folders']"
class="mr-0 theme--light v-icon">
</icon-fa>
List of dependencies:
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.35",
"@fortawesome/free-regular-svg-icons": "^5.15.3",
"@fortawesome/free-solid-svg-icons": "^5.15.3",
"@fortawesome/vue-fontawesome": "^0.1.10"
}
"devDependencies": {
"@fortawesome/fontawesome-free": "^5.15.3"
}
The console displays the following error:
Couldn't find one or more icon(s) {prefix: 'fas', iconName: 'fa-folders'}