Font awesome spinner not spinning

Question

I have completed an installation of fontawesome in Nuxt with this fantastic link;

https://github.com/FortAwesome/vue-fontawesome

I have a spinner rendered as

<font-awesome-icon :icon="['fas','spinner']" />

The spinner does not spin, it is static.

I added fa-spin as

<font-awesome-icon :icon="['fas','spinner', 'spin']" />

This caused the error in the console Could not find one or more icon(s) undefined

Can anyone point me in the right direction, show me how to get my spinner spinning.

The relevant portion on the nuxt.config.js

    modules: [
        'nuxt-fontawesome'
],


//font-awesome
  fontawesome: {
    imports: [
        {
          set: '@fortawesome/free-solid-svg-icons',
          icons: ['fas']
        },
    ],
  },

build: {
      config.resolve.alias['@fortawesome/fontawesome-free-brands$'] = '@fortawesome/fontawesome-free-brands/shakable.es.js'
      config.resolve.alias['@fortawesome/fontawesome-free-solid$'] = '@fortawesome/fontawesome-free-solid/shakable.es.js'
    }

In the component("../pages/index.vue") it is;

<template>
  <div>
    <font-awesome-icon :icon="['fas','spinner','spin' ]" />
  </div>
</template>

As suggested by @Steve, i have created a Glitch workspace https://glitch.com/edit/#!/join/d57a5054-b448-4a53-ad37-d9465b0cef8b

Answer 1

You can add the spin directive.

<font-awesome-icon icon="spinner" spin />

Docs: https://github.com/FortAwesome/vue-fontawesome#basic