tsconfig.json [JavaScript Support]

juunini·2021년 9월 7일
0

tsconfig.json

목록 보기
4/8
post-thumbnail

최종 수정일 : 2021년 9월 7일

!주의 이 문서는 유익하지 않습니다(?).

목차

allowJs
checkJs
maxNodeModuleJsDepth

Options

allowJs

JavaScript 파일이 .ts.tsx 파일 대신 import 되는 것을 허용합니다.
예를 들어, 아래 JS 파일을:

// @filename: card.js
export const defaultCardDeck = "Heart";

TypeScript 파일에서 import 시도하면 에러가 발생합니다:

// @filename: index.ts
import { defaultCardDeck } from "./card";
 
console.log(defaultCardDeck);

allowJs를 활성화하면 괜찮습니다:

// @filename: index.ts
import { defaultCardDeck } from "./card";
 
console.log(defaultCardDeck);

이 플래그를 이용하여 JS 프로젝트에 기존 JavaScript 파일과 함께 .ts.tsx 파일을 허용하여 점진적으로 TypeScript를 추가하도록 할 수 있습니다.

checkJs

allowJs와 함께 작동합니다. checkJs가 활성화되면 JavaScript 파일에 에러가 보고됩니다. 프로젝트의 모든 JavaScript 파일 상단에 // @ts-check를 포함하는 것과 같습니다.

예를 들어, TypeScript에 제공되는 parseFloat 정의에 따르면 다음은 잘못된 JavaScript 입니다:

// parseFloat only takes a string
module.exports.pi = parseFloat(3.124);

TypeScript 모듈이 import 할 때:

// @filename: constants.js
module.exports.pi = parseFloat(3.124);

// @filename: index.ts
import { pi } from "./constants";
console.log(pi);

어떠한 에러도 발생하지 않습니다. 하지만 checkJs를 활성화 하면 JavaScript 파일에 에러 메시지가 나타납니다.

// @filename: constants.js

>> Argument of type 'number' is not assignable to parameter of type 'string'.

module.exports.pi = parseFloat(3.124);
 
// @filename: index.ts
import { pi } from "./constants";
console.log(pi);

maxNodeModuleJsDepth

node_modules에서 검색하고 JavaScript 파일을 가져올 최대 종속성 깊이 입니다.

이 플래그는 allowJs가 활성화 되었을 때만 사용할 수 있고, node_modules 내부의 JavaScript에 대해 TypeScript가 타입을 유추하길 원한다면 사용합니다.

이 값은 0(default)으로 유지되어야 하며, d.ts 파일을 사용하여 모듈의 모양을 명시적으로 정의해야 합니다. 하지만, 속도를 희생하여 잠재적 정확성을 위해 이 기능을 사용하는 경우가 있습니다.

profile
Full StackOverFlow

0개의 댓글