How & where does webpack use the tsconfig.file and tsc

Question

Normally in a typescript project you have a tsconfig.json file, which is used with the tsc npm command to compile the project into javascript.

With webpack however the project is compiled, without tsc being installed. yet the tsconfig.json still exists in the project root.

The question I'm interested in, is how does webpack use the tsconfig.file? does it use tsc command under the hood? and is the tsconfig.json file is at all necessary in a webpack project?

Answer 1

With Webpack, the behaviors you are asking about are dependent on the TypeScript loader you use in your Webpack configuration, e.g., ts-loader or awesome-typescript-loader. I believe both of these loaders require you to have the typescript npm package installed in your project (so in fact the tsc executable should be present in your node_modules/.bin), and the loaders do the equivalent of require("typescript") and use the TypeScript Compiler API in-process rather than executing a tsc subprocess. These loaders will honor most settings in a tsconfig.json file if one exists, so you can share settings between your IDE and your Webpack build; I'm not familiar with what they do if the tsconfig.json file doesn't exist.