tsconfig.json이란 무엇인가?

1. 정의

타입스크립트를 자바스크립트로 변환할 때 필요한 컴파일 옵션들을 설정한 파일

2. 자주 사용하는 컴파일 옵션

Flag	Type	Default
--allowJs	boolean	false
Allow JavaScript files to be a part of your program. Use the checkJS option to get errors from these files.
--baseUrl	string
Specify the base directory to resolve non-relative module names.
--declaration	boolean	true if composite; false otherwise.
Generate .d.ts files from TypeScript and JavaScript files in your project.
--esModuleInterop	boolean	true if module is node16 or nodenext; false otherwise.
Emit additional JavaScript to ease support for importing CommonJS modules. This enables allowSyntheticDefaultImports for type compatibility. ex) import React from 'react'; (x) -> To prevent this error, the '--esModuleInterop' compiler option.       import * as React from 'react'; (o)
--init	boolean
Initializes a TypeScript project and creates a tsconfig.json file.
--jsx	preserve, react, react-native, react-jsx, or react-jsxdev
Specify what JSX code is generated.
--lib	list
Specify a set of bundled library declaration files that describe the target runtime environment.
--outDir	string
Specify an output folder for all emitted files.
--target	es3, es5, es6/es2015, es2016, es2017, es2018, es2019, es2020, es2021, es2022, or esnext	ES3
Set the JavaScript language version for emitted JavaScript and include compatible library declarations.
--types	list
Specify type package names to be included without being referenced in a source file.
--typeRoots	list
Specify multiple folders that act like ./node_modules/@types.
--strict	boolean	false
Enable all strict type-checking options.
--module	none, commonjs, amd, umd, system, es6/es2015, es2020, es2022, esnext, node16, or nodenext	CommonJS if target is ES3 or ES5; ES6/ES2015 otherwise.
Specify what module code is generated.
--watch	boolean
Watch input files.

3. 사례

{
  "compilerOptions": {
    "noImplicitReturns": true,
    "strict": true,
    "lib": ["DOM", "ES2015", "ES2016", "ES2017", "ES2018", "ES2019", "ES2020"],
    "target": "ES2015" // ES6 = ES2015(공식 명칭), ES2016, ES2017, ES2018, ES2019, ES2020
  },
  /*
  "include": ["gugudan.ts"], // 컴파일할 파일들을 적습니다.
  "exclude": ["*.js"], // 모든 js 파일을 포함하지 않겠다는 의미입니다.
  "extends": ""
  */
}

4. 참고 사이트

• tsc CLI Options - https://www.typescriptlang.org/docs/handbook/compiler-options.html
• Intro to the TSConfig Reference - https://www.typescriptlang.org/tsconfig