UNPKG

4.11 kBMarkdownView Raw
1# gen-typescript-declarations
2
3[![NPM version](https://img.shields.io/npm/v/@polymer/gen-typescript-declarations.svg)](https://www.npmjs.com/package/@polymer/gen-typescript-declarations)
4
5A library which generates TypeScript declarations for Polymer and custom
6elements.
7
8## How do I use the typings?
9
10### Polymer
11
12To use the typings, install Polymer normally from Bower (versions 2.4 and
13above), and add a [triple-slash
14directive](https://www.typescriptlang.org/docs/handbook/triple-slash-directives.html)
15anywhere in your TypeScript project for the typings you require. Each HTML
16import from Polymer has a corresponding typings file. For example, if you depend
17on `polymer-element.html`:
18
19```ts
20/// <reference path="./bower_components/polymer/types/polymer-element.d.ts" />`
21
22class MyElement extends Polymer.Element {
23 ...
24}
25```
26
27Alternatively, you can add the dependency to `tsconfig.json` in the root of your project:
28
29```javascript
30{
31...
32 "include": [
33 "src/**/*.ts",
34 "src/bower_components/polymer/**/*.d.ts",
35 ]
36}
37```
38
39Typings for Polymer 3 are planned but not yet available (see
40[#18](https://github.com/Polymer/gen-typescript-declarations/issues/18)).
41
42You may also be interested in the [Polymer
43decorators](https://github.com/Polymer/polymer-decorators).
44
45## How do I generate new typings?
46
47You can run this package from the command line with `gen-tsd`, or as a library
48with the `generateDeclarations` function.
49
50It is recommended to integrate typings generation as part of your build/release
51process:
52
53```sh
54$ npm install --save-dev @polymer/gen-typescript-declarations
55```
56
57Add a `gen-tsd` script to your `package.json`:
58
59```js
60{
61 ...
62 "scripts": {
63 "gen-tsd": "gen-tsd"
64 }
65}
66```
67
68If you're using Bower, ensure you run `npm run gen-tsd` to generate the latest
69typings and commit them to your repository before tagging each release.
70
71If you're using NPM, you can instead add this script to the NPM `prepack`
72script to generate and include typings in your NPM package every time you
73publish.
74
75## Config options
76
77By default the `gen-tsd` command will read a file called `gen-tsd.json` in
78your root directory. It has the following options:
79
80* **`excludeFiles`**`: string[]`
81
82 Skip source files whose paths match any of these glob patterns. If
83 `undefined`, defaults to excluding directories ending in "test" or "demo".
84
85* **`excludeIdentifiers`**`: string[]`
86
87 Do not emit any declarations for features that have any of these identifiers.
88
89* **`removeReferences`**`: string[]`
90
91 Remove any triple-slash references to these files, specified as paths
92 relative to the analysis root directory.
93
94* **`addReferences`**`: {[filepath: string]: string[]}`
95
96 Additional files to insert as triple-slash reference statements. Given the
97 map `a: b[]`, a will get an additional reference statement for each file
98 path in b. All paths are relative to the analysis root directory.
99
100* **`renameTypes`**`: {[name: string]: string}`
101
102 Whenever a type with a name in this map is encountered, replace it with
103 the given name. Note this only applies to named types found in places like
104 function/method parameters and return types. It does not currently rename
105 e.g. entire generated classes.
106
107## Using as a module
108
109You can also use this package as a module:
110
111```js
112import {generateDeclarations} from 'gen-typescript-declarations';
113
114const config = {
115 "exclude": [
116 "test/**",
117 ],
118 "removeReferences": [
119 "../shadycss/apply-shim.d.ts",
120 ],
121 "addReferences": {
122 "lib/utils/boot.d.ts": [
123 "extra-types.d.ts"
124 ]
125 },
126 "renameTypes": {
127 "Polymer_PropertyEffects": "Polymer.PropertyEffects"
128 }
129}
130
131// A map of d.ts file paths to file contents.
132const declarations = await generateDeclarations('/my/root/dir', config);
133```
134
135## FAQ
136
137### Why are some typings missing?
138This library is based on [Polymer
139Analyzer](https://github.com/Polymer/polymer-analyzer) which has limitations in
140its static analysis. For certain patterns, Analyzer relies on additional JSDoc
141annotations.
142
143### Can I augment the generated typings with hand-written ones?
144Yes, see the `addReferences` config option above.