Typescript: Add functions to "window" with ".d.ts" File

Question

I'm having a legacy *.js application and want to port parts of it to typescript.

So far I found @types definitions for most of the used packages, but there is a global function added to the window object.

I was able to fix the compilation error by addind this at the beginning of the *.ts File:

declare global { interface Window { openConformationModal?: any; } }

Now obv I don't want to include this in all my *.ts so I wanted to added it to a *.d.ts file so it is recogniced in all packages.

The problem is, that if I add the same file to a e.g. window.d.ts file, it isn't recogniced. I know that the types in the folder are found because I a added it with

 { ..., "compilerOptions": { .... "typeRoots": [ "FFOLDERPATH_TO_D_TS_FILE" ] } }

and there is another *.d.ts which is found.

PS: Solution is based on How do you explicitly set a new property on `window` in TypeScript?

Stefan · Accepted Answer · 2019-03-06 09:04:56Z

I found it further down this question: https://stackoverflow.com/a/40698148

interface Window { MyNamespace: any; }

Full answer:

Here's how to do it, if you're using TypeScript Definition Manager!

npm install typings --global

Create typings/custom/window.d.ts:

interface Window { MyNamespace: any; } declare var window: Window;

Install your custom typing:

typings install file:typings/custom/window.d.ts --save --global

Done, use it‌! Typescript won't complain anymore:

window.MyNamespace = window.MyNamespace || {};

This is the perfect usecase for npx as in npx typings install file:typings/custom/window.d.ts --save --global so you don't have to install and maintain version of the typings library locally
Typescript Definition Manager has been deprecated. Any updates to the answer?

Collectives™ on Stack Overflow

Typescript: Add functions to "window" with ".d.ts" File

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related