时间戳

首页 > 解决方案 > 如何在打字稿中组织我的类型/接口声明？

typescript - 如何在打字稿中组织我的类型/接口声明？

问题描述

我对打字稿有点陌生，让我有点困惑的事情之一是类型/接口声明。我正在编写一个当前有几个类和更多类型/接口声明的库。我在大部分代码中都使用这些类型/接口，最初我会将它们放在文件types夹中的单个文件中，然后我会在需要的地方导入它们，现在我models.d.ts在 types 文件夹中有一个声明 a namespace types，在这个命名空间中我导出我在整个代码中使用的所有类型/接口。这种方法可以吗，还是有更好的方法来组织类型和接口定义？

标签： typescripttypescript-typings

解决方案

通常你只将 .d.ts 文件用于非强类型的 JS 库的类型定义文件。这是关于 .d.ts 文件的另一个 SO：关于 TypeScript 中的“*.d.ts”。拥有一个包含您的类型的目录是我们使用的解决方案，并且似乎效果很好。是的，您必须在文件中导入类型，但它允许您明确说明它，如果您使用“TypeScript Hero”插件，VS Code 可以自动为您添加导入。

此外，您可以将多种类型放在一个文件中，但我只会使用组合在一起的功能，例如飞机、汽车和船只，如果它们足够小，例如 file vehicles.ts，或者您可以有四个文件: vehicles.ts, airplanes.ts,cars.ts和boats.ts, 你有泛型类型vehicles.ts和其他文件中的特定类型。

现在，如果你从一个文件开始，vehicles.ts它开始随着一堆不同的类型增长，并决定你想把它们分开，一种方法你可以做到这一点，除了你的类型代码之外不重构任何东西是创建一个名为车辆的目录，然后将所有文件放入您重构的文件中，并以包含所有类型的导入和导出的 index.ts 文件结束。这是一个例子：

您的项目文件：

import { Boeing737, Boeing747, FordExplorer, BassBoat } from 'src/types/vehicle'

这当前正在引用该目录中的 vehicle.ts 文件。现在，一旦我们进行了重构，现在有了目录：'src/types/vehicle'，其中包含重构的 .ts 文件，您将创建一个index.ts如下所示的文件：

export { Boeing737, Boeing747 } from './airplanes';
export { FordExplorer, ToyotaCorolla, ToyotaSienna } from './cars';
export { BassBoat, Yacht } from './boats';

现在您在项目文件中的导入完全没有改变，但它现在从子文件中获取其类型。然后，这允许在不更改项目文件的情况下进行进一步重构，例如，如果您想将汽车与 SUV 分开。如果您在所有文件中使用相同的类型，您只需要一个可以复制到新文件的导入行，或者只是根据需要导入它们。

如果您想了解有关 index.ts 文件及其工作原理的更多信息，请参阅 Typescript 文档：https ://www.typescriptlang.org/docs/handbook/module-resolution.html 。

推荐阅读