브레이크포인트 설정
문제가 의심되는 TypeScript 줄에 실행 중단 지점을 둔다.
Debugging
TypeScript 디버깅 세션
브레이크포인트는 실행을 멈추고, sourcemap은 컴파일된 JavaScript를 원본 TypeScript 줄과 연결한다.
VS Code에서 확인하는 순서
runtime state런타임 실행
Node.js나 브라우저가 컴파일 결과를 실제로 실행한다.
원본 줄 매핑
sourcemap이 실행 위치를 TypeScript 소스와 맞춘다.
상태 확인
콜스택, 지역 변수, props나 state를 함께 살핀다.
breakpoint
runtime
sourcemap
call stack
변수 확인
디버깅의 핵심은 타입 오류가 아니라 실행 순간의 값이다. 빌드 결과와 원본 파일이 맞물려야 줄 위치가 흔들리지 않는다.