Configuring TypeScript 16 exercises
solution

Utilizing Declaration Maps in TypeScript

The solution is to modify the tsconfig.json file to enable declarationMap under the compilerOptions.


// inside tsconfig.json
{
"compilerOptions": {
"declaration": true,
"declarationMap": true
// ...

By enabling declarationMap, TypeScript will generate a `.d.ts.map

Loading solution

Transcript

00:00 Okay the solution is when you're inside this tsconfig.json you can add declaration map true and when we change this to declaration map true we're going to see that inside the dist folder when I save this we're going to see a new file being added. So let's save that and bam we get

00:18 index.d.ts map. What this does is it maps between the index.d.ts file and the source file. So this means now just by the presence of this file being in here that when I go into test.ts I can command

00:33 click onto my func and I can go bam and now I'm inside the actual source file here which is exactly what you want really. You don't often want to be actually messing about with the .d.ts file

00:46 you want to go straight to the source and the index.d.ts map helps you do that. So this isn't always what you want right like if you're publishing this to npm you probably aren't publishing the source files along with it because really when people use your code they're just

01:04 going to be using the built code but if you're in a monorepo where you actually have access to the source and when you change the source it changes the build code then declaration maps are really really important because they actually let you kind of go directly where you need to go without

01:19 messing around with the declaration files. So when you're in a monorepo declaration map true is something you want to set.