TS Configuration

TypeScript Configuration

The behavior of the TypeScript compiler is entirely controlled by a single configuration file.

This crucial file is named tsconfig.json and lives in the root of your project directory.

It dictates exactly how strict the compiler should be and how it generates JavaScript.

Understanding this file is critical for setting up professional web applications.


1. The Compiler Options

The compilerOptions block is where the absolute magic happens.

You can specify the target JavaScript version, like compiling modern TS down to ES5.

This ensures your code runs flawlessly on older, legacy internet browsers.

Basic tsconfig.json Example:

{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "strict": true,
    "outDir": "./dist"
  }
}

2. Include and Exclude

By default, TypeScript attempts to compile every single .ts file it can possibly find.

You can restrict this by utilizing the include and exclude arrays.

Excluding directories like node_modules drastically speeds up compilation times.

Include and Exclude Example:

{
  "compilerOptions": { "strict": true },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "**/*.test.ts"]
}

3. SEO and Strict Mode

Turning on "strict": true is the best decision you can make for your codebase.

It enables a suite of type checks that guarantee high stability in production environments.

Stable websites don't crash, leading to better user engagement and maximum SEO visibility.

Strict Mode Example:

{
  "compilerOptions": {
    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true
  }
}

Exercise

?

What is the default name of the TypeScript compiler configuration file?


4. Final Thoughts

Always run tsc --init when starting a new project to generate a properly commented config.

Review the options closely to tailor the compilation process to your specific needs.

Next and finally, let's look at running TypeScript seamlessly with Node.js!