Skip to content
| Marketplace
Sign in
Visual Studio Code>Snippets>Yapi to CodeNew to Visual Studio Code? Get it now.
Yapi to Code

Yapi to Code

zhixiaoqiang

|
65 installs
| (1) | Free
基于 YApi 生成 ts/dart/...
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

YAPI TO CODE

一个基于 YAPI 生成 TS/Dart 的 VS Code 扩展,支持浏览整个 Yapi 组,支持自定义模板

marketplace.visualstudio

特性

  1. 🙈 0配置、开箱即用
  2. 🔥 全接口预览
  3. ✨ 内网可用
  4. 😼 多种登录方式
  5. ⚡️ 高性能
  6. ✍️ 支持 js 配置自定义输出
  7. 💡 webpack 5 (计划迁移到 Rspack)
  8. ...

TODO:

  • [ ] 1. 自定义生成模版 & 切换模版预览
  • [ ] 2. 项目组可选 - 加快请求 & 提高性能
  • [ ] 3. 请求异步加载
  • [ ] 4. 优化页面性能
  • [ ] 5. 支持自定义解析
  • [x] 6. yarn 替换为 pnpm
  • [ ] 7. 迁移到 Rspack
  • [ ] ...

登录 YAPI

初次使用,输入 yapi 的服务地址 & 账号密码,进行登录

使用

登录后,vscode 便拥有了访问 yapi 接口的能力,能够自动把任意接口转化为类型

代码诊断功能

Yapi To Code 对文档中未定义参数类型或返回值类型的接口进行波浪形警告,可以通过快速修复(quick fix)直接添加接口类型到项目中。

接口浏览器

Yapi To Code 还提供了接口预览的功能,可以通过搜索选择接口对接口类型进行预览,然后把类型复制到项目中。

这种方式比较笨拙,推荐使用代码诊断功能,一条龙完成

自定义渲染

工作区配置:可以修改 输出的字段、类型填充的位置等


配置文件:yapi-to-code.config.cjs 优先级更高

module.exports = () => {
  return {
    // resType 放置的位置 是外层的 Promise<T> 还是作为请求方法的泛型
    // 'outerFunction' | 'fetchMethodGeneric'
    responseTypePosition: 'outerFunction',
    // 生成 res 包含的属性,默认 all, 可指定为 data
    responseKey: 'all',
    genRequest(
      {
        comment,
        fnName,
        IReqTypeName,
        IResTypeName,
        requestFnName,
        apiPath,
      },
      data
    ) {
  return (
      `\n${comment}\n` +
      `export async function ${fnName}(params: I${IReqTypeName}) {
  return request.${requestFnName}<${IResTypeName}>('${apiPath}', params)
}`
      )
    }
  }
}

Webview & VS Code Data Flow.png

Webview & VS Code Data Flow

开发调试

需要依赖 src/server src/webview 的资源

编译前置依赖

pnpm i
cd src/server && pnpm start
cd src/webview && pnpm start

选择 Client + Server

debug

Tips: node 日志在源码编辑器的调试控制台查看,webview 日志在唤起的编辑器唤起 devtool 查看

打包发布

通过 vsce 打包发布 VS Code Extension

pnpm package

pnpm pub
  • Contact us
  • Jobs
  • Privacy
  • Terms of use
  • Trademarks
© 2023 Microsoft