在 API 和前端之间共享接口

Question

我正在开发双方。API 在 nest.js 中，前端在 Angular 中。双方都使用打字稿，我面临着共享接口的问题，应该是一样的。例如 ILoginRequest 和 ILoginResponse。我想将两个项目都放在单独的 GIT 存储库中。我应该将 GIT 子模块与第三个共享 GIT 存储库一起使用还是以某种方式创建共享 npm 包，或者是否有一些好的工具可以自动（从 swagger 定义）生成类到前端或其他任何东西？

Answer 1

注意：我最近偶然发现了typeorm-entitysharer，它“可用于基于相同的 TypeORM 实体创建客户端/服务器类，允许您共享它们。” 它使您可以更好地控制要共享的内容，您可以查看他们的示例。我没有选择使用它，因为我想这对我来说有点矫枉过正。但是，这就是我构建上一个项目的方式：

我的前端和后端在一个存储库中，但我想您可以将它们分开，但您仍然需要以某种方式将它们彼此相邻。文件结构将是这样的：

workspace
  ??backend        <- repo #1
  ?   ??src
  ?   ?   ??shared <- shared code goes here
  ?   ?   ??proxy.ts
  ?   ??tsconfig.json
  ??frontend       <- repo #2
      ??src
      ?   ??proxy.ts
      ??tsconfig.json

然后在backend/tsconfig.json你介绍

{
    ...
    "paths": {
        "@shared/*": [ "src/shared/*" ],
    }
}

在frontend/tsconfig.json你介绍

{
    ...
    "paths": {
        "@shared/*": [ "../backend/src/shared/*" ],

        // if you're using TypeORM, this package has dummy decorators
        "typeorm": [ "node_modules/typeorm/typeorm-model-shim.js" ]
        // you can do the same for other packages, point them to dummy paths

        // altirnatively you can route the shared imports through the proxy.ts
        // and replace them in frontend/src/proxy.ts with dummy ones
    }
}

也不要忘记npm i typeorm在你的前端。

例子

假设我有这个 backend/src/shared/user.entity.ts

import { PrimaryGeneratedColumn, Column } from 'typeorm';

export class UserEntity
{
    @PrimaryGeneratedColumn() id: number;
    @Column() name: string;
    @Column() password: string;
}

现在，我可以在任何地方使用它：

import { UserEntity } from '@shared/model/user.entity';

在后端，很明显，在前端，@shared/model/user.entity被映射到../backend/src/shared/model/user.entity，import from 'typeorm'实体内部被映射到虚拟包。