vue-fontawesome
vue-fontawesome copied to clipboard
Typescript error in Nuxt 3 integration
Describe the bug Followed the steps on how to integrate FontAwesome with Nuxt 3.
It seems the steps are not correct. I get an error when adding FontAwesomeIcon to vueApp.

When removing the last parameter (as you would do when integrating FontAwesome with Vue 3 directly - no Nuxt) the following error shows:

View Problem
Argument of type 'ComponentPublicInstance<FontAwesomeIconProps, {}, {}, {}, {}, {}, FontAwesomeIconProps, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>' is not assignable to parameter of type 'Component<any, any, any, ComputedOptions, MethodOptions>'.
Type 'ComponentPublicInstance<FontAwesomeIconProps, {}, {}, {}, {}, {}, FontAwesomeIconProps, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>' is not assignable to type 'ComponentOptions<any, any, any, ComputedOptions, MethodOptions, any, any, any>'.
Type 'ComponentPublicInstance<FontAwesomeIconProps, {}, {}, {}, {}, {}, FontAwesomeIconProps, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>' is not assignable to type 'ComponentOptionsBase<any, any, any, ComputedOptions, MethodOptions, any, any, any, string, {}>'.
Types of property 'computed' are incompatible.
Type '{ <T>(getter: ComputedGetter<T>, debugOptions?: DebuggerOptions): ComputedRef<T>; <T>(options: WritableComputedOptions<T>, debugOptions?: DebuggerOptions): WritableComputedRef<...>; }' is not assignable to type 'ComputedOptions'.
Index signature for type 'string' is missing in type '{ <T>(getter: ComputedGetter<T>, debugOptions?: DebuggerOptions): ComputedRef<T>; <T>(options: WritableComputedOptions<T>, debugOptions?: DebuggerOptions): WritableComputedRef<...>; }'.ts(2345)
Expected behavior There should be no typescript errors.
Additional context Dependencies I'm using:
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.2.0",
"@fortawesome/free-solid-svg-icons": "^6.2.0",
"@fortawesome/vue-fontawesome": "^3.0.1"
}
Thanks @cmitjans-at-wiris we'll take a look when we can.
Any update on this?
This looks like it's happened before and the workaround here worked for me: #295
This seems to be fixed now (the two args solution at least works for me)
@cmitjans-at-wiris
Are you still getting the error using the 3 args ?
nuxtApp.vueApp.component("font-awesome-icon", FontAwesomeIcon, {})
I am not seeing the error in the console ?
And if you do not mind sharing... are you using the "Error Lens" to view the inline errors in VS Code or using something else (I am not seeing any inline errors via Error Lens either)?
@cmitjans-at-wiris ---
Going to go ahead and close this issue. If you provide a reproducible repo we can re-open.