如何在单独的文件中声明和导入typescript接口

wvyml7n5  于 2023-03-31  发布在  TypeScript
关注(0)|答案(5)|浏览(115)

我想在我的基于类型脚本的项目中在它们自己的文件中定义几个接口,我将从这些文件中实现用于生产的类以及用于测试的模拟。然而,我不知道正确的语法是什么。我找到了大量关于声明接口和实现它们的教程,但它们都在同一个文件中实现了接口和派生类。这不是很现实。导出和导入接口的正确方法是什么?

crcmnpdw

crcmnpdw1#

您需要从定义的文件中导出接口,并将其导入到您想要使用的任何位置。
IfcSampleInterface.ts中:

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

单位:SampleInterface.ts

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

vof42yt12#

使用定义(d.ts)文件和命名空间,不需要以这种方式导入/导出模块。DefinitelyTyped项目有guidance和大量的examples如何做到这一点。

py49o6xq

py49o6xq3#

只导出少量接口

无需分散多个 exports,您可以将它们分组到单个export {}块中(在这种情况下,**不需要声明文件default**type):

// interfaces.ts
interface 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 { 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)
};
mbyulnm0

mbyulnm04#

可以在相对较新的项目中使用以下语法

`import type { xxx } from './xxx'`

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html

but5z9lq

but5z9lq5#

您需要导出定义的文件中的接口,并将其导入使用它们的文件中。有关示例,请参阅此链接。
x.ts

interface X{
    ...
}
export default X

y.ts

import X from "./x.ts"
// You can use X now

有关详细信息,请参见https://www.typescriptlang.org/docs/handbook/modules.html

相关问题