Using fontawesome 5 globally with svg

Since the old version of fontawesome is depricated. I would like to use the new version icon as a svg and you get to pick the icons you only need. Is this feature already added or is there a work around I could use? or am I doing something wrong?

Old code is like this:

import Vue from 'vue'
import App from './App.vue'
import Toasted from 'vue-toasted'
import fontawesome from '@fortawesome/fontawesome'
import faSolid from '@fortawesome/fontawesome-free-solid'

Vue.use(Toasted, {
  iconPack: 'fontawesome'
})
Vue.toasted.register("success_message", `<p>Deployment Complete!</p>`, {
  type: "success",
  theme: "primary",
  position: "bottom-center",
  duration: 5000,
  singleton: true,
  className: "successMessage",
  icon: "check-square",
  action: {
    icon: "window-close",
    onClick: (e, toastObject) => {
      toastObject.goAway(0);
    }
  }
})

new version doesn't work:

import Vue from 'vue'
import App from './App.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faWindowClose, faSpinner, faCog } from '@fortawesome/free-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import Toasted from 'vue-toasted'

library.add(faWindowClose,faSpinner, faCog)

Vue.component('font-awesome-icon', FontAwesomeIcon)
Vue.use(Toasted, {
  iconPack: 'fontawesome'
})
Vue.toasted.register("success_message", `<p>Deployment Complete!</p>`, {
  type: "success",
  theme: "primary",
  position: "bottom-center",
  duration: 5000,
  singleton: true,
  className: "successMessage",
  action: {
    icon: "window-close",
    onClick: (e, toastObject) => {
      toastObject.goAway(0);
    }
  }
})

capture

shakee93 / vue-toasted

Using fontawesome 5 globally with svg #91