Zenn
Open3

Orval, code reading

yoshinoyoshino
orval --config ./orval.config.js
orval.config.js
 module.exports = {
   'petstore-file': {
     input: './petstore.yaml',
     output: './src/petstore.ts',
   },
 };
  • packages
    • angular
    • axios
    • core
    • fetch
    • hono
    • mock
    • orval
    • query
    • swr
    • zod

core

orval

packages/orval/src/bin/orval.ts をみると

  • orvalコマンドを実行したときのcliの情報がある
  • cacを使用している
  • action
    • normalizeOptions
    • generateSpec

packages/orval/src/generate.tsのgenerateSpec

  • importSpecs
    • resolveSpecs
    • importOpenApi
      • generateInputSpecs (inputのopenapiファイルをopenapiObjectにしたものを生成)
      • getApiSchemas (componentsの実装コードの文字列を含むオブジェクト)
      • getApiBuilder (client実装コードの文字列を含む情報を取得 ex operations, operationsで使用されているschemas, )
  • writeSpecs
    • writeSchemas
      • writeSchema
        • fs.outputFile(getPath, getSchema)
      • getWriteMode
    • writeMode
      • writeSplitMode
      • writeTagsMode
      • writeSplitTagsMode

      • writeSingleMode

    • afterAllFilesWrite
    • execa(prettier)
const getSchema = ({
  schema: { imports, model },
  target,
  isRootKey,
  specsName,
  header,
  specKey,
}: {
  schema: GeneratorSchema;
  target: string;
  isRootKey: boolean;
  specsName: Record<string, string>;
  header: string;
  specKey: string;
}): string => {
  let file = header;
  file += generateImports({
    imports: imports.filter(
      (imp) =>
        !model.includes(`type ${imp.alias || imp.name} =`) &&
        !model.includes(`interface ${imp.alias || imp.name} {`),
    ),
    target,
    isRootKey,
    specsName,
    specKey,
  });
  file += imports.length ? '\n\n' : '\n';
  file += model;
  return file;
};

const getPath = (path: string, name: string, fileExtension: string): string =>
  upath.join(path, `/${name}${fileExtension}`);
yoshinoyoshino

orvalのclient周りについて

client

  • Type: String | Function.
  • Valid values: angular, axios, axios-functions, react-query, svelte-query, vue-query, swr, zod, fetch.
  • Default Value: axios-functions.

httpClient

  • Type: String.
  • Valid values: fetch, axios.
  • Default Value: axios.
  • httpClient only available when swr, react-query, vue-query, and svelte-query are specified as the client option.

override.mutator

  • This function is executed for each call when this one is executed. It takes all the options passed to the verb as an argument and should return a promise with your custom implementation or preferred HTTP client.
  • If you use one of the following clients react-query, vue-query and svelte-query. You can also provide a hook like this
export const listUsers = (params?: ListUsersParams, signal?: AbortSignal) => {

mutatorをhookにすると

export function useListUsers<