오래된 Grunt명령을 수행 결과를 디버깅할 일이 생겨서 MS Code에서 시도해 보기로 했다. 디버깅을 위한 설정방법을 알아보자.
설정열기
먼저 MS Code의 Debug화면으로 이동한후 설정(하단 톱니바퀴)을 클릭한다.
설정을 클릭하면 launch.json 파일이 자동으로 열린다. launch.json파일은 MS Code가 오픈하고 있는 폴더의 최상위에 .vscode 폴더밑에 존재한다. 이곳에 Grunt 디버깅용 환경설정을 추가한다.
환경설정
launch.json파일안에 다음과 같이 추가한다.
- node 타입이고, launch 한다.
- name: 디버깅창의 목록에 표시될 이름
- args: grunt <argument> 명령
- program: grunt 파일 위치
- stopOnEntry: 시작한 프로그램에서 breakpoint가 없어도 시작 프로그램에서 중단점을 자동으로 시작할지 여부
- cwd: 현재 디렉토리, 파일 참조하는 최상위 폴더 위치
"configuration": [
{
"type": "node",
"request": "launch",
"name": "Grunt Directly",
"args": ["serve"],
"program": "/Users/peter/.nvm/versions/node/v6.10.1/bin/grunt",
"stopOnEntry": true,
"cwd": "${workspaceRoot}"
},
...
]
디버깅
이제 grunt task파일을 디버깅해보자.
- 먼저 디버깅 중단점(break point)를 설정한다. 소스 에디터에서 좌측의 라인 번호 옆 공간을 클릭해서 설정한다. 클릭할 때 빨간점이 찍힌다.
- 좌측 상단에서 grunt 디버깅 설정한 명칭 "Grunt Directly"를 선택한다.
- 실행 (녹색 삼각형 버튼)을 클릭한다.
- 중단점에 실행이 멈추면서 우측 상단에 "debugging step"바가 나오고 실행, over, into, 멈춤을 통해 소스를 디버깅할 수 있다.
상세 설정 정보는 MS Code 가이드를 참조하자.
Happy, Enjoy Coding~~~
'Dev Environment' 카테고리의 다른 글
| Aptana + Spket 개발환경 구축하기 (0) | 2012.11.23 |
|---|
