I'm in the process of converting my portfolio site to use Nuxt.js, which I have hosted on Netlify. I'm having issues with my CSS taking longer than usual to load in. I don't notice this issue when developing locally, but on my live site, I can briefly see the page without any styling at all.

I have my CSS separated by their components in a folder called assets. I do also have some styling in my index.vue file, such as css variables. Below, I've also included my nuxt.config.js. Does anyone have any thoughts as to why this might be happening?

export default {
  target: "static",
  components: true,
  buildModules: [
    [
      "@nuxt/image",
      {
        provider: "static",
      },
    ],
  ],
  head: {
    title: "my title",
    htmlAttrs: {
      lang: "en",
    },
    meta: [
      {
        name: "viewport",
        content: "width=device-width, initial-scale=1",
      },
    ],
    link: [
      {
        rel: "stylesheet",
        href: "https://fonts.googleapis.com/css2?family=Open+Sans&display=swap",
      },
      {
        rel: "stylesheet",
        href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css",
      },
      {
        rel: "stylesheet",
        href: "https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css",
      },
    ],
  },
  plugins: [
    {
      src: "./plugins/analytics.js",
      mode: "client",
    },
  ],
};