vercel / vercel/next.js

Turbopack fails to evaluate variable-assigned default exports in postcss.config.mjs

Open
#97,292 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

CSS locked Turbopack
Dominant language
JavaScript
Stars
142k
Forks
32.4k
Avg merge
2d 14h
Merged PRs (30d)
351

Description

Link to the code that reproduces this issue

https://github.com/amoh909/nextjs-turbopack-postcss-bug

To Reproduce
  1. Create a postcss.config.mjs file at the root of a Next.js project with the following structure:
    const config = {
      plugins: {
        "@tailwindcss/postcss": {},
      },
    };
    export default config;
    
  2. Start the local development server (which executes Turbopack).
  3. The following trace will be printed upon loading globals.css:
    Error: Error evaluating Node.js code
    Error: PostCSS config is undefined (make sure to export an function or object from config file)
        [at Module.init (turbopack:///[turbopack-node]/transforms/postcss.ts?config=[project]/postcss.config.mjs:23:11)]
    
    
Current vs. Expected behavior

Current Behavior:
The Next.js development server fails to compile CSS files (globals.css and page.module.css), repeatedly printing a low-level compilation error to the terminal terminal: Error: Error evaluating Node.js code followed by Error: PostCSS config is undefined. The dev server remains alive, but styles do not process because Turbopack fails to read the config object when it is assigned to an intermediate variable prior to being exported.

Expected Behavior:
Turbopack's configuration evaluator should successfully parse and resolve the variable reference for the default export (const config = ...; export default config;), mirroring standard Node.js module resolution, allowing the CSS assets to compile cleanly without throwing terminal errors.

Provide environment information
Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 11 Pro
  Available memory (MB): 16109
  Available CPU cores: 16
Binaries:
  Node: 24.12.0
  npm: 11.6.2
  Yarn: N/A
  pnpm: 11.14.0
Relevant Packages:
  next: 16.3.0 // Latest available version is detected (16.3.0).
  eslint-config-next: N/A
  react: 19.2.8
  react-dom: 19.2.8
  typescript: 5.9.3
Next.js Config:
  output: N/A
Which area(s) are affected? (Select all that apply)

CSS

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

next dev (local)

Additional context

The configuration file itself is completely valid JavaScript syntax. Running the module directly through the Node.js runtime successfully resolves and extracts the object:

node -e "import('./postcss.config.mjs').then(console.log)"

Output: [Module: null prototype] { default: { plugins: { '@tailwindcss/postcss': {} } } }

Changing the file structure to use a direct inline object literal expression (export default { plugins: { ... } };) completely bypasses the terminal error loop without needing to revert Next.js versions.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by running the linked reproduction with next dev and inspecting the failing turbopack:///[turbopack-node]/transforms/postcss.ts entry point. Compare handling of the direct inline export with the variable-assigned export in postcss.config.mjs; done means globals.css and page.module.css compile without the PostCSS config error.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, nextjs, tailwindcss
Domain
build-system, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
65/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.