Angular Library 11: include index.d.ts in build

3.5k views Asked by At

I want to create typings for my library which uses an external API from <script>. If I build the library (ng build angular8-yandex-maps --prod) everything is ok but when I try to import the built library in the Angular app, it fails - Cannot find namespace 'ymaps', Cannot find type definition file for 'yandex-maps' etc.

Declared namespace isn't included in the build, is it possible to include it?

dist/**/*.component.d.ts

Cannot find type definition file for 'yandex-maps'
/// <reference types="yandex-maps" />

Reproduction

typings/yandex-maps/index.d.ts

declare namespace ymaps {
  ...
}

tsconfig.lib.json

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "outDir": "../../out-tsc/lib",
    "target": "es2015",
    "declaration": true,
    "declarationMap": true,
    "inlineSources": true,
    "types": ["yandex-maps"],
    "typeRoots": ["../../node_modules/@types", "src/lib/typings"],
    "lib": ["dom", "es2018"]
  },
  "angularCompilerOptions": {
    "skipTemplateCodegen": true,
    "strictMetadataEmit": true,
    "enableResourceInlining": true
  },
  "exclude": ["src/test.ts", "**/*.spec.ts"]
}
1

There are 1 answers

0
ddubrava On

.d.ts will not be copied, you should use .ts instead + add <reference /> in public-api.ts. As a result compiler will create dist/**/typings/yandex-maps/index.d.ts and <reference /> in public-api.d.ts.

Some further information: Typescript does not copy d.ts files to build

tsconfig.lib.json

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "outDir": "../../out-tsc/lib",
    "target": "es2015",
    "declaration": true,
    "declarationMap": true,
    "inlineSources": true,
    "types": [],
    "lib": ["dom", "es2018"]
  },
  "angularCompilerOptions": {
    "skipTemplateCodegen": true,
    "strictMetadataEmit": true,
    "enableResourceInlining": true
  },
  "exclude": ["src/test.ts", "**/*.spec.ts"]
}

typings/yandex-maps/index.ts

declare namespace {
  ...
}

public-api.ts

// <reference path="./lib/typings/yandex-maps/index.ts" />

UPD:

ESLint: Do not use a triple slash reference for ./lib/typings/yandex-maps/index.ts, use import style instead.(@typescript-eslint/triple-slash-reference)

import './lib/typings/yandex-maps/index';