vercel / next.js

The React Framework
https://nextjs.org
MIT License
123.24k stars 26.31k forks source link

Optimize CSS Modules classnames #62731

Open Mad-Kat opened 4 months ago

Mad-Kat commented 4 months ago

Link to the code that reproduces this issue

https://github.com/Mad-Kat/reproduction-module-css-hash-optimization

To Reproduce

npm install
npm run build
npm run start

open the browser at http://localhost:3000 and check the source.

Current vs. Expected behavior

All class names look like veryVeryVeryVeryVeryVeryLongModuleName_footer__UEyfO. I expected it to be minified in production so that the module name doesn't matter.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.3.0: Wed Dec 20 21:30:44 PST 2023; root:xnu-10002.81.5~7/RELEASE_ARM64_T6000
Binaries:
  Node: 20.11.0
  npm: 10.2.4
  Yarn: 1.22.21
  pnpm: 8.15.1
Relevant Packages:
  next: 14.1.1
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0
  typescript: N/A
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

App Router

Which stage(s) are affected? (Select all that apply)

next start (local), Vercel (Deployed)

Additional context

No response

akr4 commented 2 months ago

related PR: https://github.com/vercel/next.js/pull/14197