nuxt fonts global css file is not loaded in dev environment
When I run
bun dev and visit localhost:3000. the console logs this error:
I believe this is a problem with nuxt fonts but not sure what to do here. Note: the error is not there in the production environment.2 Replies
Hi @cybercoder-naj. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
This is a known issue with the Nuxt Fonts module and certain Nuxt versions. When running in development mode (e.g., with
This is a known, non-production-breaking issue with Nuxt Fonts and certain Nuxt versions in development mode. A patch is expected soon. For now, use the workarounds above if the error is disruptive to your workflow MIME type issue discussion. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
bun dev), the global fonts CSS file (nuxt-fonts-global.css) may fail to load due to a MIME type mismatch (application/json instead of text/css). The error message you see:
has been reported by multiple users after upgrading to Nuxt 3.17.2+ and using recent versions of @nuxt/fonts and Nuxt UI. The issue does not occur in production builds, only in development. Users have found that downgrading to Nuxt 3.17.1 and/or @nuxt/fonts 0.11.2 resolves the issue, but this is only a temporary workaround. The Nuxt team is aware of the problem and a patch is expected in a future release. You can track the discussion and possible fixes in the related GitHub issue: MIME type ('application/json') is not a supported stylesheet MIME type.
Workarounds:
- Downgrade Nuxt to 3.17.1 and/or @nuxt/fonts to 0.11.2.
- As a temporary fix, you can disable Nuxt UI's automatic font handling by adding the following to your nuxt.config.ts:
Then, manually manage your fonts in your CSS as needed.
Summary:This is a known, non-production-breaking issue with Nuxt Fonts and certain Nuxt versions in development mode. A patch is expected soon. For now, use the workarounds above if the error is disruptive to your workflow MIME type issue discussion. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
<@711113525023735809> Kapa.ai is still learning and improving, please let me know how I did by reacting below.