How to declare and import typescript interfaces in a separate file How to declare and import typescript interfaces in a separate file typescript typescript

How to declare and import typescript interfaces in a separate file


You need to export the interface from the file in which is defined and import it wherever you want to use it.

in IfcSampleInterface.ts:

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

In SampleInterface.ts

import { IfcSampleInterface } from './IfcSampleInterface';let sampleVar: IfcSampleInterface;


Use definition (d.ts) files and namespaces, no need to import/export modules this way. DefinitelyTyped project has guidance and huge number of examples how to do it.


Export only a few interfaces

Without spreading multiple exports, you can group them in one single export {} block (in this case, no file default type should be declared):

// interfaces.tsinterface IWords {  [key: string]: string; }interface INumbers {  [key: string]: number; }interface IBooleans {  [key: string]: boolean; }interface IValues {  [key: string]: string | number; }interface IStructures {  [key: string]: INumbers | IBooleans | IValues;}export {  // not exporting IWords | INumbers  IBooleans,  IValues,  IStructures,}

Import example

import { IBooleans, IValues, IStructures } from 'interfaces';const flags: IBooleans = { read: true, write: false, delete: false };const userFile: IValues = { user: 1, username: 'One', file: 'types.txt' };const userContext: IStructure = {  file: userFile,  permissions: flags,  counts: { views: 3, writes: 1 } // => INumbers (lint: try to remove IValues from IStructures)};