일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- nunjucks
- react-router-dom
- Board
- jest.config.mjs
- sequelize
- mysql
- Glob Pattern
- JEST
- ExpressJS
- nodejs
- Switch 사용불가
- typescript
- Passport
- Today
- Total
게으른 나르의 코딩
TypeScript와 Jest의 초기 설정 본문
JS의 메소드들을 분해해보는 작업을 하면서 같이 공부할 TypeScript와 테스트를 통해서 메소드를 만드는 작업이 성공하는지를 보고 공부하기 위해서 야심차게 시작을 했다.
그러나... Jest를 시작함에 있어서 많은 시행착오를 겪었고 시작조차 되지 않았다.
결국 찾던 끝에 발견하고 처음 시작해보는 사람들은 이런 시간 소비를 하지 않게 하기 위해 작성한다...
package.json
{
"name": "createmethod",
"version": "1.0.0",
"description": "",
"main": "index.js",
"type": "module",
"scripts": {
"test": "jest"
},
"repository": {
"type": "git",
"url": "git+https://github.com/dkxmrhe/CreateMethod.git"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/dkxmrhe/CreateMethod/issues"
},
"homepage": "https://github.com/dkxmrhe/CreateMethod#readme",
"devDependencies": {
"@babel/core": "^7.19.3",
"@babel/preset-env": "^7.19.4",
"@babel/preset-typescript": "^7.18.6",
"@jest/globals": "^29.1.2",
"@types/jest": "^29.1.2",
"babel-jest": "^29.1.2",
"jest": "^29.1.2",
"ts-jest": "^29.0.3",
"typescript": "^4.8.4"
}
}
여기서 신경써야 할 부분은 "type": "module"과 "scripts": { "test": "jest" } 부분만 추가해주고 나머지 의존성은 npm i --save-dev로 다운받으면 된다.
아래 링크에 있는 Jest 참고 자료를 들어가서 똑같이 따라하면 된다.
Jest 참고 자료를 똑같이 따라하면 tsconfig.json과 ts파일들을 제외한 나머지들은 얼추 작성된다.
tsconfig.json은 nest.js 처음 생성할 때 만들어지는 파일을 복붙만 했다.
jest.config.mjs 파일은
jest --init
이 명령어로 만들어지는데 다 주석처리 되있다.
그래서 필요한 부분에 주석을 풀어줘야 jest가 작동을 한다.
안 그러면
이렇게 에러가 뜬다.
You appear to be using a native ECMAScript module configuration file, which is only supported when running Babel asynchronously.
구글 번역 돌려보면 뜻은 'Babel을 비동기식으로 실행할 때만 지원되는 기본 ECMAScript 모듈 구성 파일을 사용하는 것 같다.' 라고 뜬다.
이 에러의 해결방법은 jest.config.mjs에 주석 처리 되어 있는 preset: "ts-jest"를 주석 해제시켜주면 된다.
만약 안에 있는 내용이 ts-jest가 아니라면 바꿔준다.
그렇게 하고 npm test를 돌려보면
성공적으로 테스트가 돌아가는 것을 볼 수 있다.
tsconfig.json으로 typeScript를 설정해줄 수 있는데 어떤 기능들이 있는지 모르니 다음 시간에
tsconfig.json의 설정과 jest.config.mjs의 설정에 뭐가 있는지 파헤쳐보겠다.
Jest 참고 자료 : https://jestjs.io/docs/getting-started
Getting Started · Jest
Install Jest using your favorite package manager:
jestjs.io
Github : https://github.com/dkxmrhe/CreateMethod
GitHub - dkxmrhe/CreateMethod
Contribute to dkxmrhe/CreateMethod development by creating an account on GitHub.
github.com