How to declare and import TypeScript interfaces in a separate file?

Sometimes, we want to declare and import TypeScript interfaces in a separate file.

In this article, we’ll look at how to declare and import TypeScript interfaces in a separate file.

How to declare and import TypeScript interfaces in a separate file?

To declare and import TypeScript interfaces in a separate file, we can use the export keyword to export interfaces.

For instance, we write

export interface ISampleInterface {
  key: string;
  value: string;
}

to export the ISampleInterface interface with export.

Then we can import it by writing

import { ISampleInterface } from "./ISampleInterface";
let sampleVar: ISampleInterface;

to import the ISampleInterface member from ./ISampleInterface.

And then we use that as a type for the sampleVar variable.

Conclusion

To declare and import TypeScript interfaces in a separate file, we can use the export keyword to export interfaces.