GraphQL은 API 스키마를 정의하는 강력한 도구이지만, 잘못된 스키마 정의는 런타임 오류를 발생시킬 수 있습니다. 이러한 이유로 타입스크립트를 사용하여 GraphQL 스키마를 린팅하는 것은 매우 중요합니다. 린팅을 통해 스키마의 오류를 사전에 발견할 수 있으며, 런타임 오류를 방지할 수 있습니다.

GraphQL 스키마 린팅 도구

여러 도구를 사용하여 타입스크립트에서 GraphQL 스키마를 린팅할 수 있습니다. 그 중에서 GraphQL Code Generator와 TypeScript GraphQL Schema Linter이 널리 사용됩니다.

GraphQL Code Generator

GraphQL Code Generator는 GraphQL 스키마로부터 타입 정의(Type Definition)를 생성하는 도구입니다. 이를 사용하여 타입스크립트에서 GraphQL 스키마를 정의하고, 다양한 코드를 자동으로 생성할 수 있습니다.

다음은 codegen.yml 설정 파일의 예시입니다.

schema: src/graphql/schema.graphql
generates:
  src/types/graphql.d.ts:
    plugins:
      - "typescript"
      - "typescript-resolvers"
    config:
      scalars:
        DateTime: Date

위 설정 파일에서 schema 항목은 사용할 GraphQL 스키마의 경로를 지정하고, generates 항목은 생성할 타입 정의의 경로와 사용할 플러그인을 지정합니다.

TypeScript GraphQL Schema Linter

TypeScript GraphQL Schema Linter는 GraphQL 스키마를 린팅하여 스키마의 일관성을 유지하고, 잠재적인 오류를 방지합니다. 다음 명령어를 사용하여 설치할 수 있습니다.

npm install -D eslint @graphql-eslint/eslint-plugin @graphql-eslint/parser

그리고 ESLint 구성 파일에 다음과 같이 추가합니다.

{
  "plugins": ["@graphql-eslint"],
  "parser": "@graphql-eslint/parser",
  "rules": {
    "@graphql-eslint/naming-convention": "error",
    "@graphql-eslint/avoid-duplicate-fields": "error",
    "@graphql-eslint/avoid-operation-name-prefix": "error"
  }
}

위 설정은 ESLint에서 GraphQL 스키마 린팅을 수행하도록 지정합니다.

결론

GraphQL 스키마를 타입스크립트에서 린팅하는 것은 안정적인 애플리케이션을 구축하는 데 중요합니다. GraphQL Code Generator와 TypeScript GraphQL Schema Linter를 사용하여 스키마의 일관성을 유지하고 런타임 오류를 줄일 수 있습니다.

이러한 도구들을 통해 타입 안정성과 코드 품질을 높일 수 있으며, 개발자들은 안정적이고 확장 가능한 GraphQL API를 구축할 수 있습니다.