vscode typescript debug !!

vscode에서 typescript의 디버거를 사용해서 확인하고 싶었는데 자꾸 이러한 에러 메시지가 떴다.

 

디버거에서 톱니바퀴를 눌러서 어디어디를 고쳐라~ 라는 말은 너무나 많았었지만 난 왜 안되는 것이었을까..

 

무튼 구글링을 통해 해결은 했다.

 

---

1. 터미널에 아래 입력

tsc --init

 

 

이렇게 많은 것들을 포함한 json이 나온다.

자세한 내용은 해당 가이드북을 통해 확인할 수 있다.

 

사실 나의 경우에는 아래의 것들만 필요해서 나머진 다 삭제했다.

{
  "compilerOptions": {  
    "strict": true,  /* 타입을 강하게! 정의할것인가? */
    "target": "ES6",  /* 사용할 ECMAScript 버전 */
    "module": "CommonJS", /* 모듈을 위한 코드 생성 설정 */
    "alwaysStrict": true, /* 모든 코드를 strict mode로 분석할 것인가? */
    "noImplicitAny": true, /* any 타입일 때 에러를 발생시킬 것인가? */
    "noImplicitThis": true, /* this의 타입을 명시하지 않으면 에러를 발생시킬 것인가 ? */
    "sourceMap": true, /* 소스맵(*.map) 파일 생성 여부 */
    "downlevelIteration": true /* ES3 및 ES5일 때도 지원할 것인가? */
  } 
}

 

2. 디버거를 실행시키고자 하는 파일 (필자는 app.ts)을 열고, 디버그 하는 창을 킨다.

위와 같이 나오게 되면 launch.json 파일 만들기 를 누른다.

 

3. node.js를 선택한다.

 

아래의 그림과 같이 나오게 되며, 

 

 

필자는 위의 내용을 아래와 같이 변경하였다.

디버거 이름과, 디버거가 실행되기 전에 먼저 실행되어야 할 task를 설정했다.

또한, 어떤 파일 (필자의 경우 workspacefolder의 app.ts)을 할 것인지 지정해준다.

{
    // IntelliSense를 사용하여 가능한 특성에 대해 알아보세요.
    // 기존 특성에 대한 설명을 보려면 가리킵니다.
    // 자세한 내용을 보려면 https://go.microsoft.com/fwlink/?linkid=830387을(를) 방문하세요.
    "version": "0.2.0",
    "configurations": [
        {
            "type": "pwa-node",
            "request": "launch",
            "name": "ts debugger",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "preLaunchTask": "tsc: build - tsconfig.json",
            "program": "${workspaceFolder}\\app.ts",
            "outFiles": [
                "${workspaceFolder}/**/*.js"
            ]
        }
    ]
}

 

4. F5를 눌러 실행해보자!

역시나 에러가 떴다. "tsc: build - tsconfig.json" 가 없다네.. 

방금 위에서 tsc --init을 해서 만들었는디.. 

작업 구성을 눌러주자! 

 

그러면 아래처럼 tsc: 빌드 - tsconfig.json이 적혀있다.!!

build가 빌드인 것 빼고는 모든게 다 똑같다!

눌러주자!

tasks.json이 만들어졌다.

 

혹시 모르니 "빌드"를 "build"로 변경하고 저장했다!

 

상위 폴더에 .vscode라는 폴더가 생겼고, 그 안에 우리가 앞에서 만들었던,  "launch.json"과 "tasks.json"이 만들어 졌다!

 

5. 다시 실행해보자!

환호성 지를 뻔 했다..

이거 때문에 3시간을 씨름을 했었다...

 

후에 또 까먹을 나를 위해 남긴다...