A type declaration file in TypeScript is a file with the extension ".d.ts" that provides type information about the shape and structure of JavaScript code.
It defines the types, interfaces, classes, functions, and variables present in the corresponding JavaScript code and provides type information that doesn't have built-in TypeScript support.
These are the 2 ways to generate type declaration files in TypeScript:
- Pass the
--declarationflag while executing thetsccommand. - Set the
declarationoption totrueinside thetsconfig.jsonfile.
Both of them will compile your TypeScript files into JavaScript along with their declaration (*.d.ts) files.
Generate Type Declaration Files Using Compiler Flag
When working with TypeScript, you can use the compiler flag --declaration with the tsc command to automatically generate declaration files.
This flag tells the TypeScript compiler to generate these declaration files alongside the compiled JavaScript files. This means you don't have to manually write them.
Generate declaration files for the entire project:
tsc --declaration
This command will compile all of your TypeScript files and generate type declaration files for them.
Generate a declaration file for a single TypeScript file:
tsc --declaration main.ts
This command will only compile the main.ts file and generate the main.d.ts declaration file.
Also Read: How to Add Custom Types For NodeJS process.env in TypeScript
Set Configuration Option in tsconfig.json File
If you don't want to use the --declaration flag every time you run the tsc command, you can set the configuration option "declaration": true in your tsconfig.json file.
{
"compilerOptions": {
// ...
"declaration": true,
}
}
When you set this option and run tsc command, the TypeScript compiler will compile all the TypeScript files and generate type declaration files for them automatically.
tsc
Every time you don't have to use any compiler flag.
But if you try to compile a single file with this option, it won't generate the declaration file for that. You have to use the --declaration flag if you run the tsc command with a filename.
tsc main.ts
When you run the tsc command with a filename, it will only compile the TypeScript. You won't get the main.d.ts file. This option only works for the tsc command.
Also Read: TypeScript Function Overloading: Learn Best Ways to Use It
Conclusion
That's how you can generate type declaration files automatically using the TypeScript compiler. I have shown you 2 ways in this blog post.
If you compile your TypeScript files frequently then setting the declaration option in your tsconfig.json file is a good choice. This way you don't have to type the --declaration flag every time.
But if you don't need to compile your TypeScript files frequently or you want to generate a type declaration file for a single TypeScript file then you can use the --declaration flag.
