BlockChain 만들기 - 1)typescript 기본설정

 

타입스크립트를 배우기 위해서 동영상을 보고 익히기로 했다. 

 

 

https://nomadcoders.co/typescript-for-beginners/lobby

Watch Now - 노마드 코더 Nomad Coders

 

 

typescript를 사용하기 위해서는 yarn을 필요로 한다. 

$brew install yarn을 통해서 yarn을 설치한다. 

 

 

https://classic.yarnpkg.com/en/docs/install/#mac-stable

Yarn

 

git repository를 만들고 나서 연결후 yarn init을 해준다. 

 

yarn 에 global 하게 typescript를 사용하기 위해서 다음과 같이 입력해준다.(터미널에)

$ yarn global add typescript

 

그다음 폴더안에 tsconfig.json파일을 생성해주고 다음과 같이 입력해준다.

이는 타입스크립트에게 어떻게 자바스크립트로 변할지 알려주고 옵션을 주는 것이다 .

{
    "compilerOptions": {//nodejs를 평범하게 사용
        "module": "commonjs",
        "target": "ES2015",//어떤버전의 자바스크립트로 컴파일 될지 설정
        "sourceMap": true//sourcemap 처리 여부
    },
    "include": [//어떤걸 import할지(어떤파일이 포함될지 설정)
        "index.ts"
    ],
    "exclude": [//어떤걸 export할지(node_modules가 설치 안되어있어도 디폴트로 해놓는 경우가 많다)
        "node_modules"
    ]
}

 

 

index.ts파일을 설치해주고 다음과 같이 입력해본다.

console.log("hello");

 

여기서 이제 index.ts파일을 index.js파일로 컴파일 할 것이다. 

 

터미널에 tsc를 입력해준다.

 

index.js와 index.js.map이 생성된 걸 확인할 수 있다.

 

index.js

console.log("hello");
//# sourceMappingURL=index.js.map

 

 

index.js.map

{"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC"}

 

 

매번 tsc를 실행하는 대신 script를 추가해서 yarn start로 실행되게끔 바꿔주자 .

package.json파일을 다음과 같이 바꿔준다. 

{
  "name": "Blockchain",
  "version": "1.0.0",
  "description": "Learning Typescript by making a Blockchain with it",
  "main": "index.js",
  "repository": "https://github.com/yunhalee05/Typescript_Blockchain.git",
  "author": "yunhalee05 <yunhalee0506@naver.com>",
  "license": "MIT",
  "scripts":{
    "start":"node index.js",
    "prestart":"tsc"//start하기 전에 매번 tsc를 실행시켜 ts파일을 index파일로 컴파일해준다.
  }
}

 

터미널에서 yarn start를 실행하면 

 

콘솔에 잘 뜨는 것 확인 가능

 

index.js와 map 파일이 없어도 yarn start만 하면 알아서 tsc 실행시켜서 

다시 파일이 생성되도록 해준다.