CSS on Nuxt 3 app doesnt load properly

Help
1

Locally the front end works great with bootstrap css and my custom css file loading great. Once deployed with Vercel it seems like some parts of the css dont load. I’ve gone through my project with multiple AIs, renamed/moved files and the issue presists. Any ideas?

Deployment URL or Custom Domain: https://hellenic-defence-net.vercel.app/
Environment (local, preview, production): production and preview
Project Framework: Nuxt.js
Build Settings:
  Framework Preset:
  Build Command (if not default):
  Output Directory (if not default):
  Install Command (if not default):
Node/Runtime Version:
Package Manager:
Relevant Packages:
2

Hi, @dk-raw! Welcome to the Vercel Community :smile:

I just went on your site and it looks like the CSS is working correctly now?

Feel free to share your solution with us.

Let us know if you need any more help with anything else!

3

Hello and thanks for your interest!
I have indeed found a macgyver-esque solution. The problem was that Nuxt loaded my custom CSS that overrides parts of Bootstrap before it loaded Bootstrap it self from the head. My solution was to just copy & paste the whole bootstrap css into a local file and add my 400ish lines at the end. Of course it works but it wastes bandwith and space. A more elegant solution would be greatly appreciated of course.

4

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.