— Typescript, Babel — 1 min read
상황에 따라 다름. 아래 구체적인 설명
tsc
for TypeScripttsc
사용Babel
을 사용해서 transpiling 후 tsc
로 타입 체크https://www.typescriptlang.org/docs/handbook/babel-with-typescript.html
ts-node, ts-jest, ts-karma, create-react-app-typescript 등 여러가지 컴파일러 커스터마이징 해서 사용하는 대신 Babel로 해결 가능.
(2021-04-19기준) Typescript v3.7에서 지원한다. => 더이상 이유가 아님. 참고
https://github.com/jgierer12/awesome-babel-macros를 참고하여 다양한 Babel macro를 사용하는 경우(난 사용 안해봤지만 Typescript에서 지원하지 않는 기능이 Babel에 있다는게 핵심.)
isolatedModules
플래그 활성화하면 타입스크립트는 위 문제를 미리 경고해준다.
tsconfig.json
1{2 "compilerOptions": {3 "isolatedModules": true // Ensure that each file can be safely transpiled without relying on other imports.4 }5}
.babelrc
1{2 "env": {3 "development": {4 "plugins": [5 [6 "styled-components",7 { "ssr": true, "displayName": true, "preprocess": false }8 ]9 ],10 "presets": ["next/babel"]11 },12 "production": {13 "plugins": [14 [15 "styled-components",16 { "ssr": true, "displayName": false, "preprocess": false }17 ]18 ]19 }20 }21}
.d.ts
를 만들 수 없다. 라이브러리 만드는 경우 Babel만으로는 어려울 수 있다.tsconfig.json
1{2 "compilerOptions": {3 "declaration": true // Generate .d.ts files from TypeScript and JavaScript files in your project.4 }5}