How to add custom typings to a library build?

Type of Issue

[x] Bug Report
[ ] Feature Request

Description

I’m working on a project where unfortunately there are some events polluting the window object… nobody is proud of that here but that’s what we got 🙈

When running angular-cli -> ng build, the angular-cli is able to compile a specific ts file that contains a call to window.specialEvent but when running ng-packagr -p we get: Property ‘specialEvent’ does not exist on type ‘Window’. I have a local file window.d.ts that contains:

declare global {
  export interface Window {
    specialEvent(eventName: string, data: any): boolean;
  }
}

this is our tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

Expected Behaviour

Angular library is build with success 😎

Version Information

ng-packagr: ^1.3.0
node: v6.9.1
@angular/cli: 1.4.5,
@angular: ^4.2.4
rxjs: ^5.4.2,
zone.js: ^0.8.14

ps. thanks in advance for your support and thanks for this great project!

[dherges]

Hi @x1c0,

thanks for reporting.

My recommendation is to either use typings from node_modules/@types/<*> or reference a custom *.d.ts file by a triple slash refertence. The latter is a proven solution for working with custom (proprietary / legacy) libs - maybe, you even need the d.ts file by hand - at least it works well with at least one proprietary lib that I use.

[mark-at-tusksoft]

Stumbled across this from a google search. Just to clarify, once you have created the typings file (i.e. projects/lib-project/src/typings.d.ts) Be sure to add it to the types array in projects/lib-project/tsconfig.lib.ts

{
  "compilerOptions": {
    "types": [
      "./src/typings"
    ],
  }
}

This worked for me; now VSCode recognizes the namespaces referenced in typings.d.ts and the tsconfig.lib “types” addition helps ng-packagr find the custom typings file.