VSC/Cursor에서 NestJs 디버깅 환경 구축하기

.vscode/launch.json에 Node 설정 추가하기

먼저 프로젝트 루트에 .vscode 폴더 만들고 안에 launch.json 생성해줍니다.

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "pwa-node",
      "request": "launch",
      "name": "NestJS: Watch & Debug",
      "program": "${workspaceFolder}/node_modules/@nestjs/cli/bin/nest.js",
      "args": ["start", "--watch"],
      "cwd": "${workspaceFolder}",
      "runtimeArgs": ["--nolazy"],
      "sourceMaps": true,
      "outFiles": ["${workspaceFolder}/dist/**/*.js"],
      "envFile": "${workspaceFolder}/.env",
      "console": "integratedTerminal"
    }
  ]
}

자세한 설명은 아래와 같습니다.

• version: 디버깅 설정 파일의 스펙 버전을 정의합니다.
• configurations: 하나 이상의 디버깅 구성 목록을 담는 배열입니다.
• type: 사용할 디버거 종류를 "pwa-node"로 Node.js 환경에 맞춰 지정합니다.
• request: 실행 시나리오를 "launch"로 설정해, 새 프로세스를 시작하게 합니다.
• name: VS Code UI에 표시될 이 디버깅 구성의 식별 이름입니다.
• program: 실제로 실행할 진입 스크립트(nest.js)의 파일 경로입니다.
• args: 프로그램에 전달할 인수 목록으로 "start --watch"를 지정합니다.
• cwd: 디버깅 시 기준이 될 작업 디렉터리를 프로젝트 루트로 설정합니다.
• runtimeArgs: Node 런타임에 넘길 추가 플래그(--nolazy)를 정의합니다.
• sourceMaps: TypeScript 원본과 매핑할 소스맵 사용 여부를 활성화합니다.
• outFiles: 컴파일된 JavaScript 파일의 위치 패턴을 지정해, 브레이크포인트 매핑을 돕습니다.
• envFile: 자동으로 로드할 환경변수 파일(.env) 경로를 지정합니다.
• console: 디버거 출력이 통합 터미널(integratedTerminal)에 표시되도록 설정합니다.

실행하기

이제 본격적으로 breakpoint를 걸고, Trigger 해줍니다. 그리고 Start Debugging을 눌러줍니다.

그러면 이렇게 아래와 같이, 성공한 것을 확인할 수 있습니다.

이렇게 Visual Studio Code와 Cursor에서도 NestJs 앱을 손쉽게 디버깅을 할 수 있습니다.