typeScript

typeScript

npm init -y

npm i -D typescript ts-node @types/node

번들/빌드
npx tsc index.ts 로 실행하면 된다.

테스트로 빠르게 확인하고 싶을때
npx ts-node [파일]

tsconfig.json

{

"compilerOptions": {

"outDir": "./dist/",

"baseUrl": ".",

"paths": {

"@src/*":["src"]

}

}

}

//별명을 설정해서 절대경로로 쉽게 접근

"paths": {

"@src/*":["src"]

}

ts-node에서 쓰는

npm i tsconfig-paths

실행 명령어

npm ts-node -r tsconfig-paths/register [파일명]

편하게 쓰기 위해서 package.json에

script 부분에 추가

"dev:ts": "ts-node -r tsconfig-paths/register"

실행 명령어

npm run dev:ts ./src/core/index.ts

eslint , prettier

코드 맞추려고 씁니다.(중요함!)

npm i -D eslint prettier eslint-plugin-prettier

exlint-config-prettier

.eslintrc

{

"extends":["plugin:prettier/recommended"]

}

.prettierrc

{

"printWidth":120,

"tabWidth":4,

"singleQuote":true,

"trailingComma":"all",

"semi":false

}

확장자 Prettier - Code formatter 설치

ctrl + , 를 눌러 설정에서 format > Editor: Default Formatter > prettier로 설정

세미콜론이 자동으로 사라져야 적용 완료

테스트 코드를 작성하는 프레임워크 설치

javascript -> jest

typescript -> jest

npm i -D ts-jest @types/jest babel-core

npm i -D @babel/preset-typescript @babel/preset-env

babel.config.js

module.exports = {

presets: [

[

'@babel/preset-env',

{

targets: { node: 'current' },

},

],

'@babel/preset-typescript',

],

}

jest.config.ts

import type { Config } from '@jest/types'

const config: Config.InitialOptions = {

moduleFileExtensions: ['ts', 'js'],

testMatch: ['<rootDir/**/*.test.(js|ts)'],

moduleNameMapper: {},

testEnvironment: 'node',

//log가 간지나게 찍히는 ...

verbose: true,

preset: 'ts-jest',

}

export default config

  
  

npx jest로 실행

jest.config.ts 에서 verbose:true 로 했기 때문에 콘솔 로그가 자세히 나온다.