TypeScript에서 Zod 스키마로 변환 — Numio

이럴 때 사용하세요

• API 타입이 이미 TypeScript interface로 있고, 스키마를 직접 쓰지 않고 들어오는 요청을 런타임에 검증하고 싶을 때.
• 폼 입력을 Zod로 검증하면서 스키마를 공유 TypeScript 타입과 일치시키고 싶을 때.

사용 방법

1. TypeScript interface나 타입 별칭을 붙여 넣습니다. @minimum 13이나 @format email 같은 JSDoc 태그를 추가하면 검증기가 생성됩니다.
2. 설정에서 Keep TSDoc Comments를 켜면 주석이 출력에 복사되고, Skip the creation of zod validators from JSDoc annotations를 켜면 태그가 무시됩니다.
3. 소스는 /api/typescript-to-zod를 통해 서버에서 변환됩니다. "zod"에서 z를 import하는 코드를 복사하세요.

export interface Signup {
  /**
   * @format email
   */
  email: string;
  /**
   * @minimum 13
   * @maximum 120
   */
  age: number;
  plan: "free" | "pro";
  referrer?: string | null;
  createdAt: Date;
}

import { z } from "zod"

export const signupSchema = z.object({
  email: z.string().email(),
  age: z.number().min(13).max(120),
  plan: z.union([z.literal("free"), z.literal("pro")]),
  referrer: z.string().optional().nullable(),
  createdAt: z.date(),
})

세부 정보 및 제한 사항

입력은 변환을 위해 서버 라우트(/api/typescript-to-zod)로 전송되며, 브라우저에서만 처리되지 않습니다. Next.js API 라우트는 기본적으로 최대 1 MB의 요청 본문을 받습니다.

타입만 변환됩니다. export된 함수와 상수에서는 스키마가 생성되지 않습니다.

입력에 없는 타입을 참조하는 타입이 있으면, 변환기는 스키마를 출력하지 않고 의존성 누락 오류를 보고합니다.

스키마는 의존 순서대로 정렬되므로 Author처럼 참조되는 타입이 그 타입을 사용하는 타입보다 먼저 출력됩니다.

FAQ

관련 도구

사양 및 참고 자료

• Zod documentation
• ts-to-zod on GitHub