【问题标题】:How do I organise my types/interfaces declarations in typescript?如何在打字稿中组织我的类型/接口声明?
【发布时间】:2019-04-08 05:07:53
【问题描述】:

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

【问题讨论】:

    标签: typescript typescript-typings


    【解决方案1】:

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

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

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

    您的项目文件:

    import { Boeing737, Boeing747, FordExplorer, BassBoat } from 'src/types/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

    【讨论】:

      猜你喜欢
      • 2021-01-20
      • 2019-03-26
      • 1970-01-01
      • 2019-02-16
      • 2019-05-28
      • 2018-12-11
      • 2022-11-02
      • 2019-05-05
      • 2021-02-06
      相关资源
      最近更新 更多