如何为codegen-openapi生成的RTK Query接口添加路径前缀？

方案1：在代码生成阶段注入前缀 #

如果使用@rtk-query/codegen-openapi工具，可通过配置文件中的transformer函数，在生成代码时自动给所有接口路径添加微服务前缀：

import type { CodegenConfig } from '@rtk-query/codegen-openapi';

const config: CodegenConfig = {
  schemaFile: 'https://api.companyname.com/serviceA/swagger.json',
  apiFile: './src/services/baseApi.ts',
  apiImport: 'createApi',
  outputFile: './src/services/serviceA.generated.ts',
  exportName: 'serviceAApi',
  hooks: true,
  // 自定义路径转换逻辑
  transformer: (code) => {
    // 匹配所有生成的url字段，添加/serviceA前缀
    return code.replace(/url: `\/([^`]+)`/g, 'url: `/serviceA/$1`');
  },
};

export default config;

该方法能一次性解决所有接口的路径前缀问题，无需手动修改生成后的代码。

方案2：通过RTK Query的baseQuery统一配置前缀 #

无需修改生成的代码，直接在创建API实例时，给fetchBaseQuery设置baseUrl，所有请求会自动拼接前缀：

import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
// 导入生成的API定义
import { serviceAApi } from './serviceA.generated';

// 配置带有微服务前缀的baseQuery
const baseQuery = fetchBaseQuery({
  baseUrl: '/serviceA',
});

// 复用生成的endpoint，替换baseQuery
const api = createApi({
  baseQuery,
  endpoints: () => ({ ...serviceAApi.endpoints }),
});

export const { useGetEndpoint1Query } = api;

这种方式适合不想改动生成代码的场景，同时能统一管理微服务的基础路径。

方案3：使用OpenAPI Generator CLI的base-path参数 #

如果用官方OpenAPI Generator工具生成RTK Query代码，可在生成命令中直接指定--base-path参数：

openapi-generator-cli generate \
  -i https://api.companyname.com/serviceA/swagger.json \
  -g typescript-rtk-query \
  -o ./src/services/serviceA \
  --base-path /serviceA

生成后的所有接口路径会自动带上/serviceA前缀，无需后续修改。

针对多微服务场景，只需给每个微服务单独配置对应的生成命令或配置文件即可，互不影响。

内容的提问来源于stack exchange，提问作者Esben von Buchwald