참고: database 주소가 바뀌면 codegen.yml 파일과 _app.tsx 파일을 수정해줘야 한다.
codegen.yml 파일을 수정하면 재실행(타입스크립트 최신화) 해야 한다. 재실행 명령어:yarn generate
codegen을 이용하면 playground에서 타입을 미리 받아와서 타입스크립트 형태의 파일로 만들어준다!
타입을 일일이 지정하지 않아도 된다.
graphql-codegen을 사용할 수 있게 하는 명령어 설치
yarn add @graphql-codegen/cli
graphql의 typescript 설치
yarn add @graphql-codegen/typescript
//프로젝트 설정값
schema: http://backend06.codebootcamp.co.kr/graphql
generates:
./src/commons/types/generated/types.ts:
plugins:
- typescript
config:
typesPrefix: I
codegen.yaml
파일 생성
yaml 파일 = yml 파일 : 설정 파일
들여쓰기를 기준으로 부모/자식/형제 관계를 구분한다.
package.json
파일의 scripts 부분에 "generate": "graphql-codegen",
추가
터미널에 yarn generate
입력
package.json
에 codegen이 추가되었다.
./src/commons/types/generated/types.ts
codegen.yaml 파일의 generates: 부분에 입력한 경로에 graphQL의 타입들이 저장되어 있다!