import.meta.dirname + import.meta.filename `undefined` in page

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/import-meta-dirname-reproduction-vj3gfq?file=%2Fapp%2Fpage.tsx%3A1%2C1

To Reproduce

1. Open the reproduction
2. Observe import.meta.dirname is undefined in the webpack-compiled page.tsx (but is a dir path in Node.js)

Changes to repro template:

• upgrade to Node.js 20.11.0 via dev container config
• switch to "type": "module" to enable running ESM with Node.js (and change module.exports = to export default in next.config.js)
• add file import-meta.dirname.js with console.log() of import.meta.dirname
• add console.log() of import.meta.dirname to app/page.tsx

Current vs. Expected behavior

I expected import.meta.dirname and import.meta.filename, introduced in Node.js 20.11.0 to not be undefined in Next.js pages in the App Router, but it is undefined

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Sun Aug  6 20:05:33 UTC 2023
Binaries:
  Node: 20.11.0
  npm: 10.2.4
  Yarn: 1.22.19
  pnpm: 8.14.1
Relevant Packages:
  next: 14.1.1-canary.1
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.1.3
Next.js Config:
  output: N/A

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

Module resolution (CJS / ESM, module resolving)

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

next dev (local), next build (local)

Additional context

No response

_PACK-2953

Start with the linked CodeSandbox reproduction and the webpack-compiled app/page.tsx, then trace how Next.js handles import.meta during the App Router's next dev and next build stages. Done means import.meta.dirname and import.meta.filename are no longer undefined in the affected page and match the expected Node.js behavior.