intelliJ에서 GraphQL을 작성할 때 유용한 플러그인을 발견했습니다.
설정 파일의 기술이 필요합니다만, 꽤 쓰기 쉬워질까라고 생각합니다.
이런 식으로 보완이 효과가 있습니다.

js-graphql-intellij-plugin

여기에서 공개된 플러그인입니다.
htps : // 기주 b. 코 m / 지 mky 엔데 메이 r / js-g 등 phql

기능

자동 완성

신택스 하이라이트

클라이언트 기능

설치

preference > plugin에서 jsGraphQL로 검색하면 나옵니다.

그대로 설치로 OK입니다.

설정

설치 후 .graphql 파일이나 .js에서 graphql이 작성된 파일을 열면 다음과 같은 정보가 표시됩니다.


여기서 create graphql.config.json을 선택합니다.

그러면 루트 바로 아래에

graphql.config.json

graphql.schema.json

가 자동으로 생성됩니다.
graphql.config.json이 구성 파일.
graphql.schema.json은 스키마 파일의 샘플입니다.
이 구성 파일에서 엔드포인트와 스키마를 설정합니다.

API schema.json이 있다면

연결할 API의 scheme.json이 이미 있는 경우 graphql.schema.json으로 바꿉니다.
또 배치에 대해서는, graphql.config.json의 이하 file 부분에 지정의 scheme.json의 패스를 지정하면 그쪽을 읽어들게 됩니다.

    "README_file" : "Remove 'file' to use request url below. A relative or absolute path to the JSON from a schema introspection query, e.g. '{ data: ... }' or a .graphql/.graphqls file describing the schema using GraphQL Schema Language. Changes to the file are watched.",
    "file": "graphql.schema.json", 

schema.json이 없으면

shcema.json이 없으면 엔드포인트에서 자동으로 구문 분석하여 intellij에서 schema.json을 작성, 완성 및 강조 표시할 수 있습니다.
그 때는 앞서 설명한 file 부분을 삭제하고,

    "README_file" : "Remove 'file' to use request url below. A relative or absolute path to the JSON from a schema - -introspection query, e.g. '{ data: ... }' or a .graphql/.graphqls file describing the schema using GraphQL Schema Language. Changes to the file are watched.",
-    "file": "graphql.schema.json",

아래의 URL 부분을 엔드포인트 URL로 변경합니다.
다음 예제에서는 여기 포켓몬 API를 로컬로 시작한 것을 사용합니다.

    "README_request" : "To request the schema from a url instead, remove the 'file' JSON property above (and optionally delete the default graphql.schema.json file).",
    "request": {
+      "url" : "http://localhost:5000/",
      "method" : "POST",

그래서 저장하면 아래 그림과 같이 intellij에 schema 파일이 생성됩니다.
이쪽으로부터 type등 정의되고 있는 것이 확인할 수 있으므로 편리합니다!
(오류가 발생하면 엔드포인트가 잘못되었거나 옵션(인증 등) 설정이 부족합니다)

intellij에서 query를 던지기 위한 엔드포인트 설정

shceme.json이 있으면 graphql.config.json의 다음 URL 부분을 편집하지 않으면 intellij에서 쿼리를 던질 수 있습니다.

  "README_endpoints": "A list of GraphQL endpoints that can be queried from '.graphql' files in the IDE",
  "endpoints" : [
    {
+      "name": "pokemon",
+      "url": "http://localhost:5000/",
      "options" : {
        "headers": {
          "user-agent" : "JS GraphQL"
        }
      }
    }
  ]

사용해보기

.gql 파일에서도


.js 파일의 graphQL도 괜찮습니다.


또한 쿼리 실행도 intellij에서 할 수 있습니다! !


편리! !