Introduction to tsconfig.json

tsconfig.json marks a TypeScript project root and holds compilerOptions, include, exclude, and references. Running tsc without source filenames searches for a project configuration; passing file names directly often bypasses project settings. Start strict, choose a runtime target, and explicitly include the application's source files.

This object models settings you might put in compilerOptions; it is not itself a tsconfig.json file. The practical lab provides the real JSON document and commands.

A TypeScript object variable named config does not configure tsc; the actual file must be named tsconfig.json or selected with -p.

Save as tsconfig-json.ts. The following program passed strict TypeScript compilation, and the displayed output was captured by executing its emitted JavaScript with Node.js 22.16.0.

TypeScript source

type BuildOptions = { strict: boolean; target: string; outDir: string };
const config: BuildOptions = { strict: true, target: "ES2022", outDir: "dist" };
console.log(`${config.target} -> ${config.outDir}`);
console.log(`Strict: ${config.strict}`);

Verified output

ES2022 -> dist
Strict: true

Compile: npx tsc --strict --target es2022 --module commonjs tsconfig-json.ts; run: node tsconfig-json.js. For Node.js API examples, install @types/node first. For browser projects, use the browser-specific instructions below.

The example demonstrates the code-level behavior; the related configuration or test commands are shown separately when needed.

This object models settings you might put in compilerOptions; it is not itself a tsconfig.json file. The practical lab provides the real JSON document and commands.

Predict what changes if you alter one input. Then run the code to compare your reasoning with the real output.

Practical project lab: These are real configuration and source-file examples, not a TypeScript object that merely describes settings. Place the files at the named paths relative to one project directory.

tsconfig.json

{"compilerOptions":{"target":"ES2022","module":"CommonJS","strict":true,"rootDir":"src","outDir":"dist"},"include":["src/**/*.ts"]}

src/main.ts

console.log("Configured project");

Commands

npx tsc -p .
node dist/main.js

Running tsc with -p uses the actual tsconfig.json.

This local compiler or test-runner mini-project was validated in addition to the primary program.

A TypeScript object variable named config does not configure tsc; the actual file must be named tsconfig.json or selected with -p.

Identify whether the failure is a type-checking issue, a configuration issue, or a runtime behavior issue before choosing a fix.

Create tsconfig.json with strict true, src as the include directory, and dist as the output directory. Run npx tsc -p .

Write down your expected result first. For configuration examples, compare compiler output and diagnostics; for test examples, make the assertion fail deliberately to verify that the tool reports it.

For the exact current options and platform behavior, consult the official documentation. These examples were verified using the tool versions described above.

A tsconfig.json file tells the TypeScript compiler which source files belong to a project and how to check and compile them.

• Put compiler settings such as strict, target, and outDir inside compilerOptions.
• Run npx tsc -p . from the project directory to use its configuration. Passing source filenames directly skips the project configuration.
• A TypeScript variable named config does not configure the compiler. Save the settings in the actual JSON file.
• Compilation checks and emits code; running the emitted JavaScript is a separate step. Configuration changes do not change JavaScript that has already been deployed.