Configuring tsconfig.json

Eman Awad
Nov 8, 2023
2 min read
post_comment0 Comments
post_like1 Likes

#What is a tsconfig.json ?

tsconfig.jsonfile specifiesTScompiler settings required to compileTSfiles in your project. Using it we can customize these settings based on your project requirements such astarget version,module system, andstrictness. and other options.

To createtsconfig.jsoninvoke the following command :

tsc --init

After invoking the previous command we will note that tsconfig.json is created in our project directory.

image

Now we will get to know some compiler settings that we can customize throughtsconfig.jsonfile:

  • target: specifies the ECMAScript version of theTScompiler(e.g., "es5", "es6"). It determines the version ofJavaScriptthat theTypeScriptcode will be compiled into.

  • module: defines the module system to be used(e.g., "commonjs", "es6").

  • strict: enforces strict type checking rules.

  • outDir: specifies output directory for the compiled JS files.

  • rootDir: specifies the root directory forTSsource files.

  • allowJs: allows the use ofJSfiles in yourTSprojects.

  • files: specifies an allowlist of files to be to be compiled.

  • include: Lists file or directory patterns that should be included in compilation.

  • exclude: Lists file or directory patterns that should be excluded from compilation.

  • extends: Allows you to extend or inherit configurations from anothertsconfig.jsonfile.

#Here's an example of atsconfig.jsonfile:

{
 "compilerOptions": {
     "target": "es6",
     "module": "commonjs",
     "strict": true,
     "outDir": "./dist",
     "rootDir": "./src",
 },
 "include": ["src/**/*.ts"],
 "exclude": ["node_modules"]
}

In thistsconfig.jsonfile we defined thatTScompiler should compileTScode to“es6”, use“commonjs”module, enforcestricttype checking rules, use“./dist”as our output directory to store the compiledJSfiles and use“./src”as source directory forTSfiles. It also includesTSfiles under“src”directory and excludes anyTSfiles under“node_modules”directory.

You can learn more about theTSconfiguration optionshere.

📍References :

🔗TypeScriptLang|GCORE

You are not logged in.