openapi-ts-request ​

// openapi-config.ts
import { generateApi } from 'openapi-ts-request'

// 从本地文件生成
generateApi({
  input: './openapi.json', // OpenAPI 规范文件路径
  output: './src/api', // 生成的 API 客户端输出目录
  httpClient: 'axios', // 使用的 HTTP 客户端，支持 axios、fetch 等
})

// 或从远程 URL 生成
generateApi({
  input: 'https://api.example.com/openapi.json',
  output: './src/api',
  httpClient: 'axios',
})

// 导入生成的 API 客户端
import { api } from './src/api'

// 使用生成的类型安全的 API 函数
async function fetchUsers() {
  try {
    // 完全类型安全的 API 调用
    const users = await api.users.getUsers()
    console.log(users.data)

    // 带参数的 API 调用
    const user = await api.users.getUserById({ pathParams: { id: 1 } })
    console.log(user.data)

    // 带查询参数的 API 调用
    const filteredUsers = await api.users.getUsers({
      queryParams: { role: 'admin', status: 'active' },
    })
    console.log(filteredUsers.data)

    // 带请求体的 API 调用
    const newUser = await api.users.createUser({
      body: { name: 'John Doe', email: 'john@example.com' },
    })
    console.log(newUser.data)
  } catch (error) {
    console.error('API 请求失败:', error)
  }
}

import { generateApi } from 'openapi-ts-request'
import axios from 'axios'

// 创建自定义 axios 实例
const axiosInstance = axios.create({
  baseURL: 'https://api.example.com',
  timeout: 10000,
  headers: {
    'Content-Type': 'application/json',
    Authorization: `Bearer ${localStorage.getItem('token')}`,
  },
})

// 添加请求拦截器
axiosInstance.interceptors.request.use(
  (config) => {
    // 在发送请求前做些什么
    console.log('请求发送:', config)
    return config
  },
  (error) => {
    // 对请求错误做些什么
    return Promise.reject(error)
  },
)

// 添加响应拦截器
axiosInstance.interceptors.response.use(
  (response) => {
    // 对响应数据做些什么
    return response
  },
  (error) => {
    // 对响应错误做些什么
    if (error.response && error.response.status === 401) {
      // 处理未授权错误
      console.log('未授权，请重新登录')
    }
    return Promise.reject(error)
  },
)

// 在生成 API 时使用自定义 HTTP 客户端
generateApi({
  input: './openapi.json',
  output: './src/api',
  httpClient: {
    type: 'axios',
    instance: 'axiosInstance', // 使用自定义的 axios 实例
    importPath: '../utils/axios-instance', // 导入路径
  },
})

import { generateApi } from 'openapi-ts-request'

generateApi({
  input: './openapi.json',
  output: './src/api',
  httpClient: 'axios',
  options: {
    // 生成的模块类型 (esm 或 cjs)
    moduleType: 'esm',

    // 是否生成请求和响应类型
    generateTypes: true,

    // 是否生成请求和响应示例
    generateExamples: true,

    // 是否生成 API 文档注释
    generateDocs: true,

    // 自定义类型映射
    typeMapping: {
      // 将 OpenAPI 的 integer 类型映射为 TypeScript 的 number 类型
      integer: 'number',

      // 将 OpenAPI 的 string:date 格式映射为自定义 Date 类型
      'string:date': 'Date',

      // 将 OpenAPI 的 string:date-time 格式映射为自定义 DateTime 类型
      'string:date-time': 'DateTime',
    },

    // 自定义操作 ID 生成
    operationIdTransform: (operationId, path, method) => {
      // 自定义操作 ID 转换逻辑
      return operationId.toLowerCase()
    },
  },
})

// api.ts
import { api } from './src/api'

// UserService.ts
import { ref, Ref } from 'vue'
import { api } from '../api'
import type { User } from '../api/models'

export function useUsers() {
  const users: Ref<User[]> = ref([])
  const loading = ref(false)
  const error = ref(null)

  const fetchUsers = async () => {
    loading.value = true
    error.value = null

    try {
      const response = await api.users.getUsers()
      users.value = response.data
    } catch (err) {
      error.value = err
      console.error('获取用户失败:', err)
    } finally {
      loading.value = false
    }
  }

  return {
    users,
    loading,
    error,
    fetchUsers,
  }
}