프로젝트 빌드 TypeScript by npm

빈폴더 생성 - > 터미널접근 ->

npm init - > 기본설정을 완료하면 - > package.json이 생성된다. (이곳에서 npm정보와 명령어 관리를 할수있다.)

 

타입스크립트를 사용할것임으로

npm i(install) typescript - npm설치 명령어를 통해서 typescript를 설치해준다.

- > package-lock.json 생성

 

index.ts 에서 typescript가 정상적으로 작동한다.

 

ts 파일을 js 파일로 변환시켜보자 ! 그냥 주먹구구식으로 npm tsc 했는데 안된다.

왜그럴까 생각해보니 어떻게 변환할것인지에 대한 명세가 없다. 그걸 설정해주는 파일을 만들자

tsconfig.json 이름이 정확히 일치해야 작동한다. 이곳 명세서에 target 과 source(index.ts) 를 등등 을 설정하고

//tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "Es2015",
        "sourceMap": true
    },
    
    "include" : ["index.ts"],
    "exclude": ["node_modules"]
}

 

 

 

명령어를 실행 !  npx tsc - > 잘 작동한다 !

 

지금부터 우리가 활용할 명령어는 

node index.js ( js파일을 로딩하는것)

npx tsc (ts 파일을 js 파일로 변환시키는것)

 

변환시킨다음 생성된 파일을 로딩해야하니깐 순서는 npx tsc - > node index.js 가 되는데 이렇게 하면

변경사항이 있을때 마다 터미널에 적어가면서 해야하니깐 npm package.json 에서 개인설정을 하자

 

//package.json
{
  "name": "npm_controller",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  
  "scripts": {
        "start":"node index.js",
        "prestart":"npx tsc",
        "name":"bahavior"
  },  
  "author": "",
  "license": "ISC",
  "dependencies": {
    "typescript": "^4.5.4"
  }
}

이렇게 설정을 해두면

npm start 한번입력으로 prestart인 npx tsc를 처리하고 start node index.js 를 실행 시켜서 결과값이 나온다.

 

개인작명한 것을 실행시킬떄는

npm run name 으로 실행시켜야 하니 이점 유의하자 ! 

 

자 이제 npm으로 타입스크립트를 설치하고 기본적인 셋팅이 끝났다.