VSCode debugging error when using Yarn PnP with NextJS 15

[IsaacAndela]

Link to the code that reproduces this issue

https://github.com/IsaacAndela/nextjs-yarn-vscode-debug-error

To Reproduce

1. Create a new NextJS app with Yarn yarn dlx create-next-app@canary and answer the default to all questions.
2. This should result in .pnp.cjs, .pnp.loader.mjs and .yarn in the root of the new project. If not, run yarn install.
3. Open the new project in Visual Studio Code.
4. Create a .vscode/launch.json file with the following content:

{
	"version": "0.2.0",
	"configurations": [
		{
			// Basicly the same server side debugging configuration as the official documentation:
			// https://nextjs.org/docs/app/building-your-application/configuring/debugging#debugging-with-vs-code
			"name": "Type: Node Terminal",
			"type": "node-terminal",
			"request": "launch",
			"command": "yarn run dev"
		},
		{
			// An alternative way to configure the debugging.
			// This doesn't work either with NextJS 15.
			"name": "Type: Node",
			"request": "launch",
			"runtimeExecutable": "yarn",
			"runtimeArgs": ["run", "dev"],
			"type": "node",
			// This is only here to make debugging easier
			// The error can also be reproduced without the
			// integratedTerminal
			"console": "integratedTerminal"
		}
	]
}

5. Run yarn run dev in the terminal. This should work fine.
6. In VSCode run Debug: Select and Start Debugging from the Command Palette (cmd+shift+p or ctrl-shift-p) and choose either launch configuration.
7. This should result in the following error:

node:internal/modules/cjs/loader:1252
  throw err;

Error: Cannot find module '/Users/me/nextjs-yarn-vscode-debug-error/.pnp.cjs /Users/me/Applications/Visual Studio Code.app/Contents/Resources/app/extensions/ms-vscode.js-debug/src/bootloader.js'
Require stack:
- internal/preload
    at Function._resolveFilename (node:internal/modules/cjs/loader:1249:15)
    at Function._load (node:internal/modules/cjs/loader:1075:27)
    at TracingChannel.traceSync (node:diagnostics_channel:315:14)
    at wrapModuleLoad (node:internal/modules/cjs/loader:218:24)
    at Module.require (node:internal/modules/cjs/loader:1340:12)
    at node:internal/modules/cjs/loader:1824:12
    at loadPreloadModules (node:internal/process/pre_execution:729:5)
    at setupUserModules (node:internal/process/pre_execution:207:5)
    at prepareExecution (node:internal/process/pre_execution:160:5)
    at prepareMainThreadExecution (node:internal/process/pre_execution:55:10) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [ 'internal/preload' ]
}

Current vs. Expected behavior

I expect to be able to debug my NextJS 15 application in VSCode using Yarn PnP.

However this results in the following error on startup:

node:internal/modules/cjs/loader:1252
  throw err;

Error: Cannot find module '/Users/me/nextjs-yarn-vscode-debug-error/.pnp.cjs /Users/me/Applications/Visual Studio Code.app/Contents/Resources/app/extensions/ms-vscode.js-debug/src/bootloader.js'
Require stack:
- internal/preload
    at Function._resolveFilename (node:internal/modules/cjs/loader:1249:15)
    at Function._load (node:internal/modules/cjs/loader:1075:27)
    at TracingChannel.traceSync (node:diagnostics_channel:315:14)
    at wrapModuleLoad (node:internal/modules/cjs/loader:218:24)
    at Module.require (node:internal/modules/cjs/loader:1340:12)
    at node:internal/modules/cjs/loader:1824:12
    at loadPreloadModules (node:internal/process/pre_execution:729:5)
    at setupUserModules (node:internal/process/pre_execution:207:5)
    at prepareExecution (node:internal/process/pre_execution:160:5)
    at prepareMainThreadExecution (node:internal/process/pre_execution:55:10) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [ 'internal/preload' ]
}

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 24.1.0: Thu Oct 10 21:02:27 PDT 2024; root:xnu-11215.41.3~2/RELEASE_X86_64
  Available memory (MB): 32768
  Available CPU cores: 12
Binaries:
  Node: 22.11.0
  npm: 10.9.0
  Yarn: 4.5.1
  pnpm: N/A
Relevant Packages:
  next: 15.0.4-canary.6
  eslint-config-next: N/A
  react: 19.0.0-rc-66855b96-20241106
  react-dom: 19.0.0-rc-66855b96-20241106
  typescript: N/A
Next.js Config:
  output: N/A

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

Developer Experience

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

next dev (local)

Additional context

It worked fine in NextJS 14

[nmgix]

re-enabling in-built javascript debugger extension kinda solve the issue. also check this related thread: microsoft/vscode-js-debug#374