pont 在法语中是“桥”的意思，寓意着前后端之间的桥梁。Pont 把 swagger、rap、dip 等多种接口文档平台，转换成 Pont 元数据。Pont 利用接口元数据，可以高度定制化生成前端接口层代码，接口 mock 平台和接口测试平台。
其中 swagger 数据源，Pont 已经完美支持。并在一些大型项目中使用了近两年，各种高度定制化需求都可以满足。
Pontx 用户请访问 Pontx
- 跨语言 天然支持 Javascript 项目及 Typescript 项目。如果使用
Java、C++等语言，可定制代码生成器支持 - 支持高度定制化 通过复写内部方法，各种高度定制化需求都可以满足
- VSCode 插件支持 专门为 Pont 开发的 VSCode 插件 vscode-pont，完美支持 Pont 所有能力
- 丰富的命令行提供丰富的命令行命令，满足不同场景的使用
- 自动化 mocks 服务Pont 自动生成所有 mocks 数据，并提供所有接口的 mocks 服务
全局安装 pont-engine
# 选择一个你喜欢的包管理器
# NPM
$ npm i -g pont-engine
# Yarn
$ yarn global add pont-engine
# pnpm
$ pnpm add -g pont-engine使用 pont start 命令，快速创建初始模板
打开 VSCode 插件商店，输入 vscode-pont 搜索安装
插件安装成功后，点击 Pont 图标，打开面板进行进一步操作。更多插件相关请参考 插件文档
点击接口代码片段图标，打开接口列表，搜索后生成接口代码片段，快速开始接口开发
实时发现后端接口更新
Pont 支持自定义数据获取 、数据源预处理、自定义代码生成器等。请参考 定制化 Pont
- 确保服务端使用 Swagger（目前只支持 Swagger V2、V3），提供的数据源接口是免登录的。如果不是，请后端帮忙简单配置一下，或者使用 fetchMethodPath 配置，通过自定义数据获取来获取带鉴权的接口的文档。
- 若需替换默认的请求信息，请参阅 pontCore。
mocks.enable 配置为 true，pont 将自动生成所有 mocks 数据，并提供所有接口的 mocks 服务。此外 IDE 提供如下功能
- 右键 pont 接口代码，可以跳转(jump to mock position)去编辑接口的 mocks 数据
- 右键 pont 接口代码，可以访问(visit mocks interface) GET 类型的 mocks 接口。
mocks 自动生成所有 mocks 数据，你也可以自由更新 mocks 数据，支持 mockjs 语法更新 mocks 数据。
参考下面的例子，来体验 pont。
- 项目 pre-commit hook 中，加上 pont check，防止本地数据源被研发人员损坏。
- 很多 Swagger 所有的接口返回的类型都类似是 Result，主要是囊括了约定的接口错误字段，类似
{ errorCode: 0, data: T, errMessage: '' }。这里建议，让后端 Swagger 的接口返回类型，去掉这个 Result 外壳。只返回 data 的 T 类型。 - vscode 配置
trigger suggest的快捷键(cmd K + cmd S)，传参时，用快捷键触发提醒，非常好用； - pont template 配置 API、defs 为全局变量；这样不需要 import 任何接口、实体类；使用 API 直接触发建议找到 模块、接口，非常方便
- 快捷键 cmd + ctrl + p 进行接口查找，非常方便；
- 善于利用实体类（defs），可以当成类型用、也可以作为逻辑实现的辅助；实体类是后端写得实体类，前端自己写实体类，既没有必要，长期来看也会和后端的实现差异越来越大。如果有自定义逻辑，继承 defs 实体类即可。
- redux 项目，建议结合 https://github.com/nefe/iron-redux，一个致力类型完美和去冗余的轻量化 redux 库。例如类型友好的，运行安全的 get 方法：https://github.com/nefe/iron-redux#safeget
- demo 中，生成代码的 pontFetch 函数，是要自己实现的吗？ 答：pontFetch 是用户自己项目的请求公共方法。因为每个项目的接口有自己的业务逻辑，比如如何判断接口返回的结果是否正确，所以 pont 的默认模板并没有自己实现一套 fetch 方法。另外 Pont 生成的代码是可以用自定义模板配置的。可以在模板上更改 pontFetch 的引用路径和名字。
- nestjs 搭配的 Swagger JSON 生成出来的 pont 文件为什么没有 mods?
答：nestjs 中的 Swagger 必须在每个 Controller 上添加 ApiUseTags 装饰器，并且在每个控制器的方法上添加 ApiOperation 装饰器 才能正确输出带 Tags 以及 operationId 的 Swagger JSON。Tags 和 operationId 是 pont 必需的（@nestjs/swagger 自动生成的 default Tags 暂时不被兼容）。
示例如下 (
@nestjs/swagger@^3) 对于@nestjs/swagger@^4，需要如下配置来手动注册 Tag
import { Controller } from '@nestjs/common';
import { ApiUseTags, ApiOperation, ApiOkResponse } from '@nestjs/swagger';
@ApiUseTags('pet')
@Controller('pet')
export class PetController {
@ApiOperation({ title: 'getDog', operationId: 'getDog' })
@Get()
getDog() {}
}
// ...
const options = new DocumentBuilder().setTitle('your app').addTag('pet').build();
const document = SwaggerModule.createDocument(app, options);
SwaggerModule.setup('/api', app, document);- API、defs 全局变量找不到 答：将 pont 生成的 api.d.ts 塞到 tsconfig.json 中的 includes 数组最前面。并在项目入口处 import pont 生成的入口文件。
{
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"outDir": "./**"
},
"include": ["./services/api.d.ts", "./src"],
"exclude": []
}
目前 pont 支持 Swagger V2 V3 三种数据源。其他类型数据源只需要在 scripts 中添加对应的数据格式转换文件，把对应数据格式转换为 pont 标准格式，即可适配新的数据源类型。希望社区可以踊跃贡献代码，接入更多类型的数据源！
群号：33661609
- 阿里巴巴
- 北京知道创宇信息技术股份有限公司
- 长沙蜜獾信息科技有限公司
- 联众智慧科技股份有限公司
- 深圳万国游科技有限公司
我们在这里列出了部分使用者，如果你的公司和产品使用了 Pont，欢迎到 这里 留言。
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent