I want to use Fontawesome 5 Icons with VuetifyJs. Is that possible? which npm package for fontawesome should I use? because no one worked for me. It is really confusing for me as an inexperienced VuetifyJs developer to use it, with the lack of any clear steps in the documentation of VuetifyJs.
The v-icon component provides a large set of glyphs to provide context to various aspects of your application. For a list of all available icons, visit the official Material Design Icons page. To use any of these icons simply use the mdi- prefix followed by the icon name.
Font Awesome SVG Icons Add required dependencies. Then add globally font-awesome-icon component and set faSvg as iconfont in Vuetify config. The Tidelift Subscription is a managed open source subscription for application dependencies.
OR if you are using Sass, you can import the module in app. scss . @import '~@fortawesome/fontawesome-free/scss/fontawesome'; @import '~@fortawesome/fontawesome-free/scss/<type>'; Note: Replace <type> with solid , brands or regular whatever type of icons you need.
From docs:
Font Awesome is also supported. Simply use the fa- prefixed icon name. Please note that you still need to include the Font Awesome icons in your project.
Release notes:
Things we added
v-icon now supports FontAwesome 5
You probably just need to include it in your index.html
inside <head>
or so
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
Then use like <v-icon>fa-search</v-icon>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With