vercel / next.js

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

Unable to use postcss-modules-values #59131

Open bglaz2 opened 8 months ago

bglaz2 commented 8 months ago

Link to the code that reproduces this issue

https://github.com/bglaz2/postcss-values-bug

To Reproduce

Start the application in development mode (pnpm dev). Observe the error:

./app/styles.module.css
TypeError: object null is not iterable (cannot read property Symbol(Symbol.iterator))
TypeError: object null is not iterable (cannot read property Symbol(Symbol.iterator))
Import trace for requested module:
./app/styles.module.css.webpack[javascript/auto]!=!./node_modules/.pnpm/next@14.0.4-canary.28_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[12].oneOf[7].use[2]!./node_modules/.pnpm/next@14.0.4-canary.28_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[12].oneOf[7].use[3]!./app/styles.module.css
./app/styles.module.css
 ⨯ ./app/styles.module.css.webpack[javascript/auto]!=!./node_modules/.pnpm/next@14.0.4-canary.28_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[12].oneOf[7].use[2]!./node_modules/.pnpm/next@14.0.4-canary.28_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[12].oneOf[7].use[3]!./app/styles.module.css
TypeError: object null is not iterable (cannot read property Symbol(Symbol.iterator))
Import trace for requested module:
./app/styles.module.css.webpack[javascript/auto]!=!./node_modules/.pnpm/next@14.0.4-canary.28_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[12].oneOf[7].use[2]!./node_modules/.pnpm/next@14.0.4-canary.28_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[12].oneOf[7].use[3]!./app/styles.module.css
./app/styles.module.css

Current vs. Expected behavior

App should be able to build and use the @value syntax

Verify canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 22.6.0: Wed Oct  4 21:25:26 PDT 2023; root:xnu-8796.141.3.701.17~4/RELEASE_X86_64
Binaries:
  Node: 18.17.0
  npm: 9.6.7
  Yarn: 1.22.19
  pnpm: 7.33.5
Relevant Packages:
  next: 14.0.3
  eslint-config-next: N/A
  react: N/A
  react-dom: N/A
  typescript: N/A
Next.js Config:
  output: N/A

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

Not sure

Additional context

It appears that the postcss-modules-values plugin should be configured by default, since you receive a warning when trying to add it to a custom postcss.config file (https://nextjs.org/docs/messages/postcss-ignored-plugin). However, following the repro steps, the app doesn't want to compile.

acidfernando commented 5 months ago

I have also run into this issue