Global styles are not loaded after vercel deployment

[mochetts]

After deploying this app with vercel, global styles are not applied.

In my local

In vercel

Here's the vercel app URL: https://mochetts-prismic-blog.vercel.app/

What I found so far is that the global and reset styles are not added to the header when running the next build command.

[mochetts]

UPDATE: I fixed it by moving the global & reset styles to the DefaultLayout.

[samlfair]

@mochetts Thanks for pointing this out.

@levimykel It looks like global styles don't always work in ~/pages/_document.js:

https://stackoverflow.com/questions/57205809/style-global-jsx-doesnt-seem-to-be-applied

Should we move the global styles to ~/layouts/index.js, as @mochetts did?

[levimykel]

@samlfair It seems like the global styles need to be in /pages/_app.js.
https://nextjs.org/docs/basic-features/built-in-css-support#adding-a-global-stylesheet

[ristomatti]

I can confirm this after banging my head on the wall for hours yesterday with the nextjs-website example.
There's an open issue about this also: vercel/next.js#8522.

Anyway, it looks like this has already been done, so I assume this can be closed?