Exclude a Folder from compilation with tsconfig.json in TS

# Table of Contents

1. Exclude a Folder from compilation with tsconfig.json in TS
2. Exclude using a pattern in tsconfig.json in TypeScript

# Exclude a Folder from compilation with tsconfig.json in TS

Use the exclude option in your tsconfig.json file to exclude a folder from compilation in TypeScript.

The exclude option changes what the include setting finds and defaults to node_modules and bower_components.

Copied!
{
  "compilerOptions": {
    // ... your compiler options
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "src/**/*.spec.ts", "src/example-nested"]
}

The example uses the include option to specify a pattern to include in the codebase.

The exclude array contains filenames or patterns that should be skipped when resolving the include array.

The exclude option changes what the include option finds, effectively filtering out some folders or files from compilation.

If you don't want to compile your tests but want to still have type-checking enabled in your test files, check out my other article:

• Exclude test files from Compilation in TypeScript.

If you don't explicitly add the exclude array in your tsconfig.json file, it defaults to node_modules, bower_components and jspm_packages.

# Exclude using a pattern in tsconfig.json in TypeScript

The example above uses a pattern to exclude all files that have a .spec.ts extension and are located in the src directory.

Copied!
{
  "compilerOptions": {
    // ... your compiler options
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "src/**/*.spec.ts", "src/example-nested"]
}

Regardless of where exactly in the src directory the file with the .spec.ts extension is located, it will be excluded.

The src/example-nested path points to a subdirectory called example-nested that's located in the src directory.

The contents of the src/example-nested directory wouldn't be type checked or compiled when you run the tsc command.

So, if I had the following function under src/example-nested/do-math.ts, TypeScript would just ignore the file and default the types to any.

Copied!
// 👇️ function sum(a: any, b: any): any
export function sum(a, b) {
  return a + b;
}

This makes sense because you don't want to rely on files that are excluded from compilation and end up disappearing when you build your project.

If you don't want to compile your tests but want to still have type-checking enabled in your test files, check out my other article - Exclude test files from Compilation in TypeScript.

The include and exclude options support wildcard characters for glob patterns:

• * - matches zero or more characters (excluding directory separators)
• ? - matches any one character (excluding directory separators)
• **/ matches any directory nested to any level

If you don't specify the file extension in your glob pattern, then only files with supported extensions are included.

By default, files with the following extensions are included: - .ts, .tsx, .d.ts.

If you've set allowJs to true in your tsconfig.json options, then .js and .jsx files are also included by default.

Adding a pattern or files to your exclude array doesn't prevent the files from being included in the codebase, it changes what the include setting finds.

For example, if you have the src/some-directory path in your exclude array and create a file under src/some-directory/my-file.ts, it could still be included in your project if you import any of its exports in a file that is being type-checked.

Excluded files could also end up being a part of your project if you add them to the files option in your tsconfig.json file.