Nuxt Fontawesome 5

NOTE: Seems like there is plan to migrate nuxt-fontawesome to @nuxtjs/fontawesome

Install

npm i nuxt-fontawesome
npm i @fortawesome/fontawesome-svg-core @fortawesome/vue-fontawesome

If you are using the pro set

npm i @fortawesome/pro-regular-svg-icons

NOTE: Installing the Pro version of Font Awesome

Edit nuxt.config.js.

export default {  modules: [    'nuxt-fontawesome'  ],  fontawesome: {    imports: [      {        set: '@fortawesome/pro-regular-svg-icons',        icons: ['faMapMarker'] // selectively import set to reduce size, use 'fas' to import entire set      }    ]  },}

Usage in components

<template>  <div>    <font-awesome-icon :icon="['far', 'map-marker']" />  </div></template>

NOTE: Refer vue-fontawesome for more usage example.

References:

❤️ Is this article helpful?

Buy me a coffee ☕ or support my work via PayPal to keep this space 🖖 and ad-free.

Do send some 💖 to @d_luaz or share this article.

✨ By Desmond Lua

A dream boy who enjoys making apps, travelling and making youtube videos. Follow me on @d_luaz

👶 Apps I built

Travelopy - discover travel places in Malaysia, Singapore, Taiwan, Japan.