Typescript build error using Font awesome with Vue

Question

I followed the instructions on the font awesome website for setting them up in Vue. In my main.ts file, I am getting a typescript error even though the icons work fine.

Argument of type FunctionalComponentOptions

The error occurs on this line on FontAwesomeIcon

Vue.component('font-awesome-icon', FontAwesomeIcon)

The error is Argument of type 'FunctionalComponentOptions, PropsDefinition>>' is not assignable to parameter of type 'ComponentOptions, DefaultMethods, DefaultComputed, PropsDefinition>, Record>'. Types of property 'render' are incompatible.

It's occurring because of this index.d.ts file. If I change it to any it would work.

declare module '@fortawesome/vue-fontawesome' {
  import { FunctionalComponentOptions } from 'vue'
  export const FontAwesomeIcon: FunctionalComponentOptions
  export const FontAwesomeLayers: FunctionalComponentOptions
  export const FontAwesomeLayersText: FunctionalComponentOptions
}

Even if I use all the identical code from (https://fontawesome.com/how-to-use/on-the-web/using-with/vuejs) I still get the error.

Thanks in advance for any help.

Typescript build error using Font awesome with Vue

0 Answers