Dual-published packages cannot be imported from a CJS dependency

[bartlangelaan]

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/nextjs-issue-date-fns-needs-to-be-imported-nrzmxl

To Reproduce

1. Run pnpm install
2. Run pnpm run build in the packages/pkg-using-date-fns folder
3. Start the application (root folder) in development (pnpm run dev)

Current vs. Expected behavior

The following error appears: Module not found: ESM packages (date-fns) need to be imported. Use 'import' to reference the package instead.

However date-fns is a dual-published package (both CJS and ESM). So it should be possible to use it from a CJS module.

This error does not appear in the app router, only in the pages router.

It does work with Turbopack, but not with Webpack.

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Sun Aug  6 20:05:33 UTC 2023
  Available memory (MB): 4242
  Available CPU cores: 2
Binaries:
  Node: 20.9.0
  npm: 9.8.1
  Yarn: 1.22.19
  pnpm: 8.10.2
Relevant Packages:
  next: 15.3.1-canary.7 // Latest available version is detected (15.3.1-canary.7).
  eslint-config-next: N/A
  react: 19.1.0
  react-dom: 19.1.0
  typescript: 5.3.3
Next.js Config:
  output: N/A

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

Pages Router, Module Resolution, Webpack

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

next dev (local), next build (local)

Additional context

No response