Nuxt Fontawesome 5

February 20, 2020

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:

This work is licensed under a
Creative Commons Attribution-NonCommercial 4.0 International License.