Bigo YApi Enhance

🚀 一个增强 YApi 开发体验的 VS Code 插件，让你在编码时快速查看接口信息。

✨ 功能特性

• 🔍 智能悬停提示: 鼠标悬停在函数名上即可查看 YApi 接口详情
• 📋 详细接口信息: 显示接口标题、路径、创建人、描述等信息
• 📥 请求参数展示: 清晰展示接口的请求参数及其说明
• 📤 响应示例: 格式化显示接口响应数据结构
• 🔗 快速跳转: 一键跳转到 YApi 接口详情页面
• 🏷️ 多语言支持: 支持 TypeScript、JavaScript、Vue 文件
• ⚡ 智能缓存: 自动缓存接口信息，提升响应速度
• 🔄 手动刷新: 支持手动刷新最新接口数据，保持信息同步

🎯 使用场景

前端开发者

• 在编写 API 调用代码时，快速查看接口参数和响应格式
• 无需频繁切换到 YApi 页面查看接口文档
• 提高开发效率，减少上下文切换

接口联调

• 快速确认接口参数是否正确
• 查看接口的最新状态和描述
• 方便团队协作和接口对接

📦 安装

1. 打开 VS Code
2. 按 Ctrl+Shift+X 打开扩展面板
3. 搜索 bigo-yapi-enhance
4. 点击安装

🔧 配置

插件会自动读取项目根目录下的 ytt-env.js 文件来获取 YApi token。

确保你的项目中有 ytt-env.js 文件，格式如下：

module.exports = {
  // 其他配置...
  token: 'your-yapi-token-here',
};

📖 使用说明

1. 安装插件后重启 VS Code
2. 打开项目，确保项目根目录有 ytt-env.js 文件
3. 编写代码时，将鼠标悬停在函数名上
4. 查看悬浮窗显示的 YApi 接口信息
5. 点击链接快速跳转到 YApi 详情页

刷新接口数据

当接口有更新时，可以通过以下方式刷新数据：

• 命令面板: Ctrl+Shift+P → "YApi: 刷新接口数据"
• 右键菜单: 编辑器中右键 → "YApi: 刷新接口数据"

示例

// 当你悬停在这些函数名上时，会显示对应的 YApi 接口信息
const getUserInfo = () => {
  // API 调用逻辑
};

const { data } = useUserList({
  // other
});

🎨 功能预览

当你悬停在函数名上时，会显示类似以下的信息：

🔗 YApi 接口信息

获取用户信息

📍 路径: /api/user/info
👤 创建人: 张三
📝 描述: 获取当前登录用户的详细信息

🔍 打开YApi链接

---

📥 请求参数
- userId (string) 必需: 用户ID
- fields (array): 需要返回的字段

---

📤 响应示例
{
  "code": 0,
  "message": "success",
  "data": {
    "userId": "123",
    "username": "test",
    "email": "test@example.com"
  }
}

---

🔧 来自 YApi 增强插件