How To Debug API Routes

I am trying to set up my local to be able to debug api routes in vscode following this guide: Configuring: Debugging | Next.js

There is a caveat in there:

Be aware that using NODE_OPTIONS=‘–inspect’ npm run dev or NODE_OPTIONS=‘–inspect’ yarn dev won’t work. This would try to start multiple debuggers on the same port: one for the npm/yarn process and one for Next.js. You would then get an error like Starting inspector on 127.0.0.1:9229 failed: address already in use in your console.

I am trying to run using NODE_OPTIONS='--inspect' xdn run and running into the exact issue listed above. Is there a recommended way to run the inspector so that I can attach a debugger to it in vscode?

We just added a guide for this:

The trick seems to be this setting, which allows the debugger to attach to both the XDN and the underlying Next.js app:

"autoAttachChildProcesses": true

The same should work for other frameworks such as Nuxt and Angular as well.

1 Like