ts 파일 컴파일 관련 변경사항

앞에서 ts 파일을 컴파일할 때 아래와 같이 명령어를 입력해서 컴파일했었다.

npx tsc '파일명'

매번 이렇게 하기는 좀 번거로운 감이 없잖아 있기 때문에

컴파일할 ts 파일 명을 입력하지 않아도 컴파일을 할 수 있게 설정해보도록 하겠다.

---

먼저 package.json 파일로 들어가서 script { }에 아래와 같은 logic을 추가해주자.

//package.json

script {
    //기존 코드
    "test": "echo \"Error: no test specified\" && exit 1", 
    
    //새로 추가한 코드
    "build": "tsc --build",
    //npm run build 시 ts 파일이 컴파일된다.
    /* tsconfig.json 파일에서 "include" 속성으로
     * 컴파일할 폴더를 지정했다면 해당 폴더에 저장된 ts 파일이
     * 모두 js 파일로 컴파일된다.
     * 그렇게 컴파일된 js 파일은 outDir 속성의 값으로 지정한 경로에 저장된다.
     * 앞에서 dist라는 폴더로 경로를 지정했기 때문에
     * 컴파일된 js 파일은 dist 파일에 저장된 상태이다. */
    
    "clean": "tsc --clean"
    //npm run clean을 입력하면
    //dist 폴더에 저장된 컴파일된 js 파일이 모두 삭제된다.
}

위의 코드를 추가했다면 파일을 저장하고, 아래 명령어를 입력해보자.

npm run build

 

해당 명령어를 입력하면 컴파일을 지정한 폴더인 src 폴더에 저장된 ts 파일들이 js 파일로 컴파일된다.

이렇게 컴파일된 js 파일은 앞에서 tsconfig.json에서 설정한 outDir의 경로에 저장된다.

TS 컴파일러에서 출력 경로로 설정해둔 폴더에 컴파일된 js 파일이 존재하는 것을 확인할 수 있다.

 

---

https://www.zerocho.com/category/NodeJS/post/58285e4840a6d700184ebd87

(NodeJS) npm 명령어

 

여기서 npm 명령어에 대해 간략하게 알아보자.

npm 명령어는 명령 프롬포트에 입력하는 명령어로

앞에서 사용했던 npm init이나 npm install 등이 여기에 해당된다.

 

npm start라는 명령어와 npm run이라는 명령어가 존재한다.

npm start는 package.json의 script에 있는 start 명령어를 실행하는 명령어로

별도로 설정해두지 않았다면 node server.js가 실행이 된다.

 

그리고 npm run은 그 이외의 script를 실행하는 명령어로

앞에서 우리가 추가한 build, clean과 같은 명령어는

npm run build, npm run clean을 입력하는 것으로 해당 명령어를 실행할 수 있다.

여기서 'tsc --build'는 컴파일을 지정한 폴더에 존재하는 ts 파일 전체를 js 파일로 컴파일하는 명령어이다.

그리고 npm run build 명령어는 'tsc --build'라는 명령어를 값으로 가지고 있기 때문에

npx tsc '파일명'이나 tsc --build'처럼 입력하지 않고 npm run build라고 입력하는 것으로

src 폴더에 저장된 ts 파일을 전부 js 파일로 컴파일할 수 있다.

 

(물론 tsc --build, tsc --clean을 입력해도 문제는 없다.)

(부분적으로 컴파일을 진행할 것이라면 tsc '파일명', npx tsc '파일명'으로 해도 되는 것 같다.)

(근데 프로젝트를 진행하다보면 ts, js와 같은 소스코드 파일은

 패키지를 관리하기 쉽게 별도의 패키지에 모아두는 경우가 많을 것 같다..)

(막상 또 생각해보니 tsc --build나 tsc --clean을 입력하는 것보다

npm run build, npm run clean을 입력하는 게 더 편할 것 같기도 하다..)

(Web 개발을 하면서 node를 쓸 일도 되게 많을 것 같기도 하고..

이렇게 설정을 해두는 편이 기억하기 쉬울 것 같다..)