CSS chunk loaded in a script tag (CSS modules) #72480
Labels
bug
Issue was opened via the bug report template.
Module Resolution
Module resolution (CJS / ESM, module resolving)
Webpack
Related to Webpack with Next.js.
Link to the code that reproduces this issue
https://github.com/maphe/css-module-reprex
To Reproduce
The issue is visible on the prod build:
Uncaught SyntaxError: Unexpected token '.'
<script src="/_next/static/css/f2515c4387c9bb9d.css" async=""></script>
To "reproduce" locally:
npx nx build css-module-reprex --prod --skip-nx-cache
.next/static/css
Current vs. Expected behavior
The CSS being chunked into 2 makes the app loads the second chunk as a script for some reason, hence the client component style is broken. There should only be one stylesheet loaded (or at least the second one shouldn't be inserted as a script)
Provide environment information
Which area(s) are affected? (Select all that apply)
Module Resolution, Webpack
Which stage(s) are affected? (Select all that apply)
next build (local), Vercel (Deployed)
Additional context
After investigation, I noticed that the cause of the issue is having the
opengraph-image.tsx
file import from the library that contains the components.getting rid of this line in
opengraph-image.tsx
fixes the build.The text was updated successfully, but these errors were encountered: