vanilla-extract icon indicating copy to clipboard operation
vanilla-extract copied to clipboard

Vanilla Extract + Bun Runtime Incompatibility

Open HofmannZ opened this issue 1 month ago • 0 comments

Describe the bug

Vanilla Extract's Next.js plugin fails to build when using Bun's runtime (bun --bun). The build process crashes during webpack compilation with an error indicating that the @vanilla-extract/css/adapter module is undefined.

The error occurs when webpack attempts to require the adapter module during the vanilla-extract plugin initialization. Bun's runtime appears to handle the require('@vanilla-extract/css/adapter') call differently than Node.js, returning undefined instead of the expected module exports, which causes the .setAdapter method call to fail.

Expected behavior: The build should complete successfully, as it does when using Node.js runtime (without the --bun flag).

Actual behavior: Build fails with TypeError: undefined is not an object (evaluating 'require('@vanilla-extract/css/adapter').setAdapter').

Reproduction

https://github.com/expatfile/nextjs-with-vanilla-extract-bun-runtime

Steps to reproduce:

  1. Clone the reproduction repository
  2. Run bun install
  3. Run bun run build (which executes bun --bun next build --webpack)
  4. Observe the build failure

Configuration details:

The project is a minimal Next.js 16.0.7 setup with:

  • Vanilla Extract configured via @vanilla-extract/next-plugin in next.config.ts
  • Bun runtime enabled via the --bun flag in package.json scripts
  • Webpack mode forced via --webpack flag (as Vanilla Extract doesn't support Turbopack yet)

System Info

System:
    OS: macOS 26.1
    CPU: (12) arm64 Apple M2 Max
    Memory: 381.86 MB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 24.11.1 - /Users/zinohofmann/Library/pnpm/node
    npm: 11.6.2 - /Users/zinohofmann/Library/pnpm/npm
    pnpm: 10.24.0 - /Users/zinohofmann/Library/pnpm/pnpm
    bun: 1.3.3 - /opt/homebrew/bin/bun
  npmPackages:
    @vanilla-extract/css: 1.17.5 => 1.17.5 
    @vanilla-extract/next-plugin: 2.4.16 => 2.4.16

Used Package Manager

bun

Logs

$ bun --bun next build --webpack
   ▲ Next.js 16.0.7 (webpack)

   Creating an optimized production build ...
   
NonErrorEmittedError: (Emitted value instead of an instance of Error) TypeError: undefined is not an object (evaluating 'require('@vanilla-extract/css/adapter').setAdapter')

The error occurs during the webpack compilation phase when the vanilla-extract plugin attempts to initialize its adapter. The full stack trace indicates that the adapter module cannot be properly resolved under Bun's runtime.

Additional Context

Workaround: The build succeeds when removing the --bun flag from the scripts, allowing Next.js to use Node.js runtime instead:

{
  "scripts": {
    "dev": "next dev --webpack",
    "build": "next build --webpack",
    "start": "next start --webpack"
  }
}

However, this workaround is not ideal as it means:

  • Not using Bun's runtime, losing all performance benefits of Bun
  • Unable to use the Bun base image (e.g., oven/bun Docker image) for deployment
  • Having to fall back to Node.js base images and runtime

This suggests that the issue is specifically related to how Bun's runtime handles the CommonJS require() call for the adapter module, rather than a general incompatibility with vanilla-extract's API.

Potential root cause: The @vanilla-extract/css/adapter module may be using Node.js-specific module resolution or export patterns that Bun's runtime doesn't fully support. This could be related to:

  • Conditional exports in package.json
  • Dynamic require() behavior
  • Module caching differences between Node.js and Bun

Validations

HofmannZ avatar Dec 05 '25 16:12 HofmannZ