Cannot Load nuxt-fontawesome...

[rlam3]

https://github.com/Qonfucius/nuxt-fontawesome and this nuxt-fontawesome?

[rlam3]

Also the setup and usage is very confusing. Could you consolidate it into one piece? Thanks!

This is currently my config.js file for nuxtjs app. However it isn't displaying correctly. And no icons seem to appear. Was wondering if you had any clue why. Thanks!

  /*
  ** Build configuration
  */
  build: {
    /*
    ** Run ESLint on save
    */
    vendor: [
      'axios',
      'iview',
      // 'jquery'
    ],
    modules: [
      '@nuxtjs/axios',
      ['@nuxtjs/google-adsense'],
      // https://github.com/vaso2/nuxt-fontawesome
      ['nuxt-fontawesome']
    ],

    fontAwesome: {
      // component: 'fas',
      imports: [
        //import whole set
        {
          set: '@fortawesome/fontawesome-free-solid'
        },
      ],
      packs: [
        {
          package: '@fortawesome/fontawesome-free-solid'
        }
      ]
    },

[rlam3]

The only way to get it working was to import FontAwesomeIcon again in my component .vue file... Any reason why this may be happening? Thanks!

import FontAwesomeIcon from '@fortawesome/vue-fontawesome'
export default {
  components: {
    FontAwesomeIcon
  },
}

I'd really like to know if you have some tips on how to debug this issue with chrome's vue extension.

I keep getting the following error

@vaso2 A working example would be nice. Thank you for your hard work

[vaso2]

@rlam3 Hi there! Working example should be like this:

module.exports = {
 /* Some other stuff */

  modules: [
    'nuxt-fontawesome',
     /* Some other modules */
  ],
  fontawesome: {
    imports: [
      {
        set: '@fortawesome/fontawesome-free-solid'
      }
    ]
  },
  build: {
    extend (config) {
       /* Tweak build if needed  */
    }
  },

Not inside build: {, like in your example. That's why you got a problem with importing FontAwesomeIcon. Also, big thanks for pointing at my mistakes with docs, fixed that. Happy coding!

[heidipowers]

Hey Vaso2 - thanks so much for creating this plugin!

For anyone who may be playing with the development branch of vue-fontawesome you'll get this same error. To fix it the plugin file can be adjusted from:

import FontAwesomeIcon from '@fortawesome/vue-fontawesome'

to:

import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'

Hoping to save someone else time who may also be poking around at things.

Thanks again!