tsconfig.json Configuration Basics in Typescript

Introduction

The tsconfig.json file tells TypeScript how to work on your project. It sets rules and options so your code compiles correctly.

When starting a new TypeScript project to set compiler options.

When you want to include or exclude certain files from compilation.

When you want to change how strict TypeScript checks your code.

When you want to set the output folder for compiled JavaScript files.

Syntax

Typescript

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

The file is written in JSON format.

compilerOptions sets how TypeScript compiles your code.

Examples

This sets the JavaScript version to ES5 for compatibility with older browsers.

Typescript

{
  "compilerOptions": {
    "target": "es5"
  }
}

This tells TypeScript to only compile files inside the app folder.

Typescript

{
  "include": ["app/**/*.ts"]
}

This excludes the tests folder from compilation.

Typescript

{
  "exclude": ["tests"]
}

Sample Program

This example shows a tsconfig.json that compiles all TypeScript files in src folder to ES6 JavaScript in the dist folder. The code prints a greeting message.

Typescript

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

// src/index.ts
const greeting: string = "Hello, TypeScript!";
console.log(greeting);

Important Notes

Always keep node_modules excluded to avoid compiling dependencies.

Use strict mode to catch more errors early.

You can add more options like sourceMap to help debugging.

Summary

tsconfig.json controls how TypeScript compiles your project.

Use compilerOptions to set rules like target JavaScript version and output folder.

Use include and exclude to pick which files to compile.