Go to the TypeScript source file instead of the type definition file in VS Code

Question

I created a custom npm library that is used in some root projects. This library is written in TypeScript. All sources are under a /src folder.

The tsconfig.json of the library contains those compiler options :

"sourceMap": true "outDir": "dist" 

The package.json file contains :

"main": "dist/src/index.js", "typings": "dist/src", "files": [   "src",   "dist" ], 

In the end, the generated package contains the generated .js files, the d.ts files and the .ts source files :

- package.json - /dist (`.js` and `d.ts` files) - /src (`.ts` files) 

In a root project where this custom library has been installed, I'm then able to add a breakpoint on a line calling a function imported from the library and stepping into it to debug its code, all in TypeScript. This is great!

But, in Visual Studio Code, when I CTRL-Click on a function imported from the library, without debugging, it leads me to the d.ts type definition file. I would prefere it to lead to the .ts source file! The way it is currently, I have to browse by myself to the /src folder of the library, under /node_modules, if I need to see the actual source code.

Is there a way to go to the TypeScript source file directly in VSCode, instead of the type definition file?

Answer 1

Since Typescript 2.9 it is possible to compile your library with the declarationMap flag

./node_modules/typescript/bin/tsc -p . --declarationMap 

Doing so creates a declaration map file (dist/ActionApi.d.ts.map) and a link to the map at the bottom of the corresponding d.ts file

//# sourceMappingURL=ActionApi.d.ts.map 

When VSCodes encounters such a declarationMap it knows where to go to and leads you directly to the source code.

Answer 2

Setup disableAutomaticTypeAcquisition: true in config.