nuxt / nuxt/cli

`nuxi dev --inspect` incorrect behavior (impossible to inspect nitro-runtime, server functions, middlewares and so on)

Open
#1,524 4 comments 4 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

nitro
Dominant language
TypeScript
Stars
399
Forks
119
Avg merge
20h 59m
Merged PRs (30d)
65

Description

Environment

  • Operating System: Windows_NT
  • Node Version: v22.3.0
  • Nuxt Version: 3.12.3
  • CLI Version: 3.12.0
  • Nitro Version: 2.9.7
  • Package Manager: pnpm@9.3.0
  • Builder: -
  • User Config: debug, compatibilityDate, devtools
  • Runtime Modules: -
  • Build Modules: -

Reproduction
  • Create new nuxt project (nuxi create test)
  • add file: server/api/test.get.ts
    export default defineEventHandler(async (event) => {
      console.log('request!');
      debugger;
      return { ok: true };
    });
    
  • enable debug messages in nuxt.config.ts
    // https://nuxt.com/docs/api/configuration/nuxt-config
    export default defineNuxtConfig({
      debug: true,
      compatibilityDate: '2024-04-03',
      devtools: { enabled: true }
    })
    
  • run in dev mode with --inspect flag (nuxi dev --inspect)
  • open Chrome DevTools and connect to process
  • when nuxt finish warming up, do the following HTTP request: GET /api/test (res = await fetch('/api/test', { method: 'GET' }))
  • check console - you will see the logs
  • check DevTools - you will NOT see any logs after [nitro] dev:reload, debugger keyword will not trigger debugging as well. Sources tab doesn't contain any project files (except some dependencies from node_modules)
    image
Describe the bug

The bug is inability to inspect/debug what is going on inside server-side functions (endpoints), middlewares, pages rendering (debugger keyword in pages/components/composables/...).

Additional context

Possible reference: #21312 (i didn't find solution there)

Logs
(please see attached screenshot in Reproduction section)

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue with nuxi dev --inspect and the server/api/test.get.ts handler, then compare the behavior with reference issue #21312. Trace how the CLI connects the Nuxt development server to Chrome DevTools; done means server endpoints and other project files appear in Sources and debugger statements pause execution.

Written by the indexing model from the issue text.

Assessment

Tech stack
node.js, typescript
Domain
backend, cli, developer-experience
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.