How to use import with "declare" keyword in TypeScript?

user_12669715 0
Viewed 555

I have a d.ts file with a variable declaration, like this:

declare var $: () => SomeValue;

And it is works good, in other places i can use this variable without import.

But, when i add some import from another module, this variable is not visible from other code.

import { SomeValue } from "./SomeModule";
declare var $: () => SomeValue;

What the syntax for this need?

typescript-declarations es6-modules typescript javascript
2 Answers

When .d.ts files use export or import, they become treated as a module instead of as ambient typings.

However you can still add to the global namespace using declare global. This allows you to augment global types, and even add new global types:

.d.ts

import { SomeValue } from "./SomeModule";

declare global {
    interface Window {
        $: () => SomeValue;
    }
    interface SomeGlobalInterface {
        x: number;
    }
}

.ts

// () => SomeValue
window.$

let value!: SomeGlobalInterface;
value.x;
user_11171190

You'll need to add "export" keyword to the variable.

export declare var $: () => SomeValue;

If you want this variable to only be available in the same file, then it is not necessary to add "export" keyword. However, if you want it to be used in other files, then you'll need to add "export" keyword.

The same goes for constants, functions and classes. Adding "export" to it will make it available to be imported by other files.

user_137799580
Related