PracticeEveryday
TypeScript 본문
tsconfig.json
- 매번 컴파일을 입력할 때마다 옵션을 추가하거나 제거하는 것은 매우 귀찮고 불편합니다.
명령어를 매번 입력하지 않고 보다 쉽게 사용하기 위해서 tsconfig.json을 만들어 사용합니다.
tsc 옵션
- tsconfig.json 파일이 있는 위치가 TypeScript의 루트 디렉토리로 결정됩니다.
이 파일에는 프로젝트를 컴파일 하는 데 필요한 루트 파일, 컴파일러 옵션들을 설정할 수 있습니다.
TypeScript 프로젝트는 다음 방법 중 하나로 컴파일 됩니다.
1. tsconfig.json을 사용할 경우
- 인풋 파일이 없는 tsc 명령일 경우, tsconfig.json에 설정된 모든 디렉토리를 체인하여 컴파일 합니다.
- 인풋 파일이 없는 tsc 명령일 경우, -p 옵션을 사용해 특정 디렉토리 내에 있는 tsconfig.json 또는 유효한 JSON
파일을 설정 가능합니다.
2. tsconfig.json이 없는 경우
- 인풋 파일이 있는 tsc < 파일.ts > 명령일 경우, tsconfig.json 파일은 무시됩니다.
NOTE.
tsconfig.json파일에 설정된 컴파일 옵션 보다 명령어가 우선합니다. (예: tsc -m "commonjs")
tsconfig.json 생성
tsc --init- 명령어를 통해 생성된 tsconfig.json 파일 설정 코드는 다음과 같다.
컴파일러 옵션 ( " compilerOptions ")만 추가되어 있으며 컴파일러 기본값을 사용할 경우 각 항목을 주석처리 합니다.
{
"compilerOptions": {
/* 기본 옵션
* ------------------------------------------------------------------------------------------------------------------------------------------------ */
// "incremental": true,
/* 증분 컴파일 활성화 */
"target": "es5",
/* ECMAScript 목표 버전 설정: 'ES3'(기본), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
"module": "esnext",
/* 생성될 모듈 코드 설정: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
"lib": ["dom", "dom.iterable", "esnext"],
/* 컴파일 과정에 사용될 라이브러리 파일 설정 */
"allowJs": true,
/* JavaScript 파일 컴파일 허용 */
// "checkJs": true,
/* .js 파일 오류 리포트 설정 */
"jsx": "react",
/* 생성될 JSX 코드 설정: 'preserve', 'react-native', or 'react'. */
// "declaration": true,
/* '.d.ts' 파일 생성 설정 */
// "declarationMap": true,
/* 해당하는 각 '.d.ts'파일에 대한 소스 맵 생성 */
// "sourceMap": true,
/* 소스맵 '.map' 파일 생성 설정 */
// "outFile": "./",
/* 복수 파일을 묶어 하나의 파일로 출력 설정 */
// "outDir": "./dist",
/* 출력될 디렉토리 설정 */
// "rootDir": "./",
/* 입력 파일들의 루트 디렉토리 설정. --outDir 옵션을 사용해 출력 디렉토리 설정이 가능 */
// "composite": true,
/* 프로젝트 컴파일 활성화 */
// "tsBuildInfoFile": "./",
/* 증분 컴파일 정보를 저장할 파일 지정 */
// "removeComments": true,
/* 출력 시, 주석 제거 설정 */
"noEmit": true,
/* 출력 방출(emit) 유무 설정 */
// "importHelpers": true,
/* 'tslib'로부터 헬퍼를 호출할 지 설정 */
// "downlevelIteration": true,
/* 'ES5' 혹은 'ES3' 타겟 설정 시 Iterables 'for-of', 'spread', 'destructuring' 완벽 지원 설정 */
"isolatedModules": true,
/* 각 파일을 별도 모듈로 변환 ('ts.transpileModule'과 유사) */
/* 엄격한 유형 검사 옵션
* ------------------------------------------------------------------------------------------------------------------------------------------------ */
"strict": true,
/* 모든 엄격한 유형 검사 옵션 활성화 */
// "noImplicitAny": true,
/* 명시적이지 않은 'any' 유형으로 표현식 및 선언 사용 시 오류 발생 */
// "strictNullChecks": true,
/* 엄격한 null 검사 사용 */
// "strictFunctionTypes": true,
/* 엄격한 함수 유형 검사 사용 */
// "strictBindCallApply": true,
/* 엄격한 'bind', 'call', 'apply' 함수 메서드 사용 */
// "strictPropertyInitialization": true,
/* 클래스에서 속성 초기화 엄격 검사 사용 */
// "noImplicitThis": true,
/* 명시적이지 않은 'any'유형으로 'this' 표현식 사용 시 오류 발생 */
// "alwaysStrict": true,
/* 엄격모드에서 구문 분석 후, 각 소스 파일에 "use strict" 코드를 출력 */
/* 추가 검사 옵션
* ------------------------------------------------------------------------------------------------------------------------------------------------ */
// "noUnusedLocals": true,
/* 사용되지 않은 로컬이 있을 경우, 오류로 보고 */
// "noUnusedParameters": true,
/* 사용되지 않은 매개변수가 있을 경우, 오류로 보고 */
// "noImplicitReturns": true,
/* 함수가 값을 반환하지 않을 경우, 오류로 보고 */
"noFallthroughCasesInSwitch": true,
/ * switch 문 오류 유형에 대한 오류 보고 */
// "noUncheckedIndexedAccess": true,
/* 인덱스 시그니처 결과에 'undefined' 포함 */
/* 모듈 분석 옵션
* ------------------------------------------------------------------------------------------------------------------------------------------------ */
"moduleResolution": "node",
/* 모듈 분석 방법 설정: 'node' (Node.js) 또는 'classic' (TypeScript pre-1.6). */
// "baseUrl": "./",
/* 절대 경로 모듈이 아닌, 모듈이 기본적으로 위치한 디렉토리 설정 (예: './modules-name') */
// "paths": {},
/* 'baseUrl'을 기준으로 상대 위치로 가져오기를 다시 매핑하는 항목 설정 */
// "rootDirs": [],
/* 런타임 시 프로젝트 구조를 나타내는 로트 디렉토리 목록 */
// "typeRoots": [],
/* 유형 정의를 포함할 디렉토리 목록 */
// "types": [],
/* 컴파일 시 포함될 유형 선언 파일 입력 */
"allowSyntheticDefaultImports": true,
/* 기본 출력(default export)이 없는 모듈로부터 기본 호출을 허용 (이 코드는 단지 유형 검사만 수행) */
"esModuleInterop": true
/* 모든 가져오기에 대한 네임스페이스 객체 생성을 통해 CommonJS와 ES 모듈 간의 상호 운용성을 제공. 'allowSyntheticDefaultImports' 암시 */
// "preserveSymlinks": true,
/* symlinks 실제 경로로 결정하지 않음 */
// "allowUmdGlobalAccess": true,
/* 모듈에서 UMD 글로벌에 접근 허용 */
/* 소스맵 옵션
* ------------------------------------------------------------------------------------------------------------------------------------------------ */
// "sourceRoot": "./",
/* 디버거(debugger)가 소스 위치 대신 TypeScript 파일을 찾을 위치 설정 */
// "mapRoot": "./",
/* 디버거가 생성된 위치 대신 맵 파일을 찾을 위치 설정 */
// "inlineSourceMap": true,
/* 하나의 인라인 소스맵을 내보내도록 설정 */
// "inlineSources": true,
/* 하나의 파일 안에 소스와 소스 코드를 함께 내보내도록 설정. '--inlineSourceMap' 또는 '--sourceMap' 설정이 필요 */
/* 실험적인 기능 옵션
* ------------------------------------------------------------------------------------------------------------------------------------------------ */
// "experimentalDecorators": true,
/* ES7 데코레이터(decorators) 실험 기능 지원 설정 */
// "emitDecoratorMetadata": true,
/* 데코레이터를 위한 유형 메타데이터 방출 실험 기능 지원 설정 */
/* 고급 옵션
* ------------------------------------------------------------------------------------------------------------------------------------------------ */
"skipLibCheck": true,
/* 선언 파일 유형 검사 스킵 */
"forceConsistentCasingInFileNames": true
/* 동일한 파일에 대한 일관되지 않은 케이스 참조를 허용하지 않음 */
}
}include / exclude 설정
- 컴파일에 포함할 디렉토리 / 파일 경로를 설정하거나, 제외 시킬 수 있습니다.
포함, 제외될 각 항목에는 glob 패턴을 사용하여 표기할 수 있습니다.
* 0 이상의 모든 문자와 일치 (디렉토리 분리 기호 제외)
? 1개 문자와 일치 (디렉토리 분리 기호 제외)
**/ 모든 하위 디렉토리까지 포함{
// 컴파일 포함
"include": [
"src/**/*.tsx?"
],
// 컴파일 제외
"exclude": [
"node_modules",
"build",
"**/*.(spec|test).ts"
],
// 컴파일 옵션
"compilerOptions": { ... }
}
컴파일 설정 - TypeScript Guidebook
"target": "es5", /* ECMAScript 목표 버전 설정: 'ES3'(기본), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */ "module": "esnext", /* 생성될 모듈 코드 설정: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015
yamoo9.gitbook.io
'JavaScript > TypeScript' 카테고리의 다른 글
| TypeScript (0) | 2022.06.14 |
|---|---|
| TypeScript (0) | 2022.06.10 |
| TypeScript (0) | 2022.06.10 |
| TypeScript (0) | 2022.05.01 |
| TypeScript (0) | 2022.04.30 |
'JavaScript/TypeScript' Related Articles
more
Comments