When project get bigger rootDir
and outDir
helps to organize our project. One of the normal convention is to keep all source files in src
folder and keep all distribution or the output files in dist
folder.
We can follow similar approach in a TypeScript project. We can set outDir
property in tsconfig.json
to store all JS files in dist
folder or any folder for that matter.
{
"compilerOptions": {
"outDir": "./dist"
}
}
The path or name of the output directory can be anything as you wish.
Sub folder
When we set the outDir
, it also maintains the folder structure. Say, if you have sub folders in the src
folder, the same folder structure will be maintained in the output dist
folder.
rootDir
property tells the TypeScript compiler where to look for TypeScript files. If we store all the TypeScript files inside src
folder, then it is good to set the rootDir
to ./src
.
If we do not set the rootDir
, TypeScript will compile TypeScript files in other folders or root folder and put everything in dist
folder. That will break things.