이번에는 타입스크립트와 Express를 함께 세팅하는 방법을 정리하고자 한다.
Express 프로젝트 생성
npm install -g express-generator
직접 Express를 구성해도 상관없지만, express-generator를 사용하면 간단하게
환경 구성이 가능하기 때문에 사용한다!
패키지 설치
npm install --save-dev nodemon
코드를 작성하면 바로바로 변경사항을 적용하기 위해서 nodemon을 사용한다.
npm install --save-dev @types/node @types/express @types/morgan @types/debug @types/cookie-parser @types/http-errors ts-node typescript
@types/node : 타입스크립트에서 사용할 Node.js의 타입을 추가한다.
@types/express : 타입스크립트에서 사용할 Express의 타입을 추가한다.
@types/http-errors : express-generate를 사용했을 때 사용하는 http-errors용 타입을 추가
@types/morgan : express-generate를 사용했을 때 사용하는 morgan용 타입을 추가
@types/debug: express-generate를 사용했을 때 사용하는 debug용 타입을 추가
@types/cookie-parser : express-generate를 사용했을 때 사용하는 cookie-parser용 타입을 추가
ts-node : Node.js에서 컴파일 없이 TypeScript를 실행할 수 있다.
typescript : TypeScript를 사용하기 때문에 당연히 필요하다.
package.json 설정
// ...
"scripts": {
"start": "node ./bin/www",
"dev": "nodemon --exec ts-node ./bin/www.ts"
},
// ...
dev에서 nodemon을 사용해서 변경이 발생하면 새로고침을 실행한다.
그리고 ts-node를 통해서 타입스크립트를 실행한다.
tsconfig.json 설정
{
"compilerOptions": {
"target": "ESNext",
"jsx": "react-jsx",
"module": "commonjs",
"esModuleInterop": true,
"skipLibCheck": true,
"strict": true,
"forceConsistentCasingInFileNames": true
}
}
해당 부분에 대한 정리글은 다음에 한번 더 쓸 계획이다.
결과
https://github.com/SeoJaeWan/Express-TypeScript
'Node.js > 실험실' 카테고리의 다른 글
[Node] Google Analytics 데이터 불러오기 (0) | 2023.08.10 |
---|---|
[Node.js] Express ORM 세팅해보기 (0) | 2022.10.09 |
[Node.js] Express에 Webpack 구현하기 (1) | 2022.09.28 |
[Node.js] Express set "views" (2) | 2022.09.26 |
[Node.js] Zoom 클론코딩 - 채팅방편 (1) | 2022.06.21 |