#19836·Font-Awesome

Bug: Incomplete documentation for Nuxt 3 using vue-fontawesome

Author: IonaruCreated Jul 28, 2023Updated Sep 14, 2026
Labelsdocfontawesome.com

Bug description

Using the steps provided on https://fontawesome.com/docs/web/use-with/vue/use-with#nuxt for Nuxt 3 results in the message "Could not find one or more icon(s)" in the nuxt console. The icon does work eventually but gets rendered after the page is loaded (no SSR), so results in flashing.

Full error: Could not find one or more icon(s) { prefix: 'fas', iconName: 'coffee' } {} for the code <font-awesome-icon :icon="['fa-solid', 'coffee']" />

This issue was reported a while ago here: https://github.com/FortAwesome/vue-fontawesome/issues/215 and seems to still get regular traffic from people running into the same problem.

The solution @redwarff proposed in https://github.com/FortAwesome/vue-fontawesome/issues/215#issuecomment-1352902465 seems to be the best solution, the message in the console is gone and SSR seems to be working correctly for icons. It just needs to be added to the documentation.

The solution, add to nuxt.config.ts:

build: {
    transpile: [
        '@fortawesome/vue-fontawesome'
    ]
},

So the full config for Fontawesome in combination with Nuxt 3 becomes:

export default defineNuxtConfig({
    build: {
        transpile: [
            '@fortawesome/vue-fontawesome'
        ]
    },
    css: [
        '@fortawesome/fontawesome-svg-core/styles.css',
    ],
});

Please modify https://fontawesome.com/docs/web/use-with/vue/use-with#nuxt to include the extra configuration option.

Reproducible test case

N/A

Screenshots

Font Awesome version

FontAwesome 6 and up, vue-fontawesome 3 and up.

Serving

Font Awesome CDN, Self-hosted

Implementation

SVG+JS

Browser and Operating System

All supported operating systems and browsers.

Web bug report checklist

  • I have included a test case because my odds go way up that the team can fix this when I do
  • I have searched for existing issues and to the best of my knowledge this is not a duplicate

Misc

As a side-note, is there a better place to report issues about the documentation or contribute to it? I couldn't find any repository holding the documentation pages.

Source: FortAwesome/Font-Awesome