alexmngn
alexmngn

Reputation: 9597

How to import interface definitions from the same file name?

I have a file: api.ts and I defined my interfaces in api.d.ts. Although when I run typescript it complains about my interface which cannot be found:

api.ts(24,47): error TS2304: Cannot find name 'IHeaders'.

How can I import my interfaces in my main file when they have the exact same name?

I've tried the following:

// api.d.ts

export interface IHeaders {
  [key: string]: string;
}

// api.ts

import { IHeaders } from './api';

But I get a different error:

api.ts(4,10): error TS2305: Module '"api"' has no exported member 'IHeaders'.

What's the best approach?

Thanks

Upvotes: 0

Views: 4707

Answers (2)

Aurélien Gasser
Aurélien Gasser

Reputation: 3120

SLaks's answer is correct: you shouldn't introduce .d.ts interface files.

Your api.ts could look like this

export interface IHeaders {
  [key: string]: string;
}

export class Headers implements IHeaders {
   [key: string]: string;
}

Usage (test.ts):

import { Headers, IHeaders } from "./api"

var a = new Headers();
a["x"] = "y";

However, if you really want to use a definintion file, add the following line at the top of the file in which you want to import the declarations:

///<reference path="api.d.ts" />

You can find a full example in this answer.

Upvotes: 1

SLaks
SLaks

Reputation: 887489

The point of .d.ts files is to provide typing information for legacy Javascript code.

They aren't like C/C++ header files and should not be used with Typescript code.

You should move your interfaces to the main file.

Upvotes: 3

Related Questions