CSS chunk loaded in a script tag (CSS modules)

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:

1. visit https://css-module-reprex.vercel.app/test
2. the console will show the error: Uncaught SyntaxError: Unexpected token '.'
3. the dom will have css loaded as script: <script src="/_next/static/css/f2515c4387c9bb9d.css" async=""></script>

To "reproduce" locally:

1. npx nx build css-module-reprex --prod --skip-nx-cache
2. look into .next/static/css
3. there should be one stylesheet instead of 2

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

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.1.0: Thu Oct 10 21:03:11 PDT 2024; root:xnu-11215.41.3~2/RELEASE_ARM64_T6020
  Available memory (MB): 16384
  Available CPU cores: 12
Binaries:
  Node: 20.7.0
  npm: 10.1.0
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 14.2.7 // An outdated version detected (latest is 15.0.3), upgrade is highly recommended!
  eslint-config-next: 14.2.16
  react: 18.3.1
  react-dom: 18.3.1
  typescript: 5.6.3
Next.js Config:
  output: N/A
 ⚠ An outdated version detected (latest is 15.0.3), upgrade is highly recommended!
   Please try the latest canary version (`npm install next@canary`) to confirm the issue still exists before creating a new issue.
   Read more - https://nextjs.org/docs/messages/opening-an-issue

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.

import { getLauncherColor } from '@css-module-reprex/ui';

getting rid of this line in opengraph-image.tsx fixes the build.

Start with the linked css-module-reprex and run npx nx build css-module-reprex --prod --skip-nx-cache; inspect .next/static/css and the opengraph-image.tsx import from @css-module-reprex/ui. Done means the build produces the expected stylesheet loading behavior, with no CSS chunk inserted as a script or resulting console syntax error.