Exclude a Folder from compilation with tsconfig.json in TS

avatar

Borislav Hadzhiev

Last updated: Mar 12, 2022

banner

Photo from Unsplash

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.

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

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

The filenames or specified pattern is resolved relative to the directory, which contains your tsconfig.json file.

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.

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

tsconfig.json
{ "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.

Note that we have specified the contents of the whole src directory in the include option, so we are using the exclude array to filter out some directories and files that we don't want to compile.

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 would not 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.

src/example-nested/do-math.ts
// 👇️ function sum(a: any, b: any): any export function sum(a, b) { return a + b; }
However, if you import this function in a file that is type checked in your codebase, the do-math.ts file will become a part of your project, even though it is in the exclude array.

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.

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.