How to configure tsconfig.json for typings not in @types?

Question

I'm using a tsconfig.json file to specify which typings I want to use in my app.

{
   "compilerOptions": {
       "types" : ["node", "lodash", "express"]
   }
}

This imports typings from ./node_modules/@types/node, ./node_modules/@types/lodash and ./node_modules/@types/expres.

My question is how can I configure typings for self-contained modules?

My example is the zone.js package which has both the library code and type definitions.

• ./node_modules/zone.js/dist/zone.js
• ./node_modules/zone.js/dist/zone.min.js
• ./node_modules/zone.js/dist/zone.js.d.ts

What do I put in my tsconfig.json file to include zone.js.d.ts?

Answer 1

You just have to add zone.js to the types in your tsconfig.json:

{
   "compilerOptions": {
       "types" : ["node", "lodash", "express", "zone.js"]
   }
}

Note that you do not have to include all types like this. Type definitions from the @types/* packages are automatically included.

So you could remove the types declaration in your tsconfig.json and all the @types/* packages would be automatically referenced.

In order to get zone.js to work you can either include it in a single file like this:

/// <reference types="zone.js" />

Or if you want it available in your whole project you can add a index.d.ts at the root of your project and put int the reference there.

Answer 2

You can place the file anywhere, but you need to tell the compiler about it, either by adding it in tsconfig.json or as a ///<reference>. For tsconfig add the include field:

{
    "compileOnSave": false,
    "compilerOptions": {
        ..
    },
    "include": [
        "zone.d.ts",
    ]
}