coc.nvimでGraphQL Language Serverを使えるように設定する。

導入

graphql-language-service-cliをインストールする。

npm i -g graphql-language-service-cli

www.npmjs.com

coc-settings.jsonにlanguage-serverの設定を追加する。ログを見たいので "trace.server": "verbose" を追加している。

  "languageserver": {
    "graphql": {
      "command": "graphql-lsp",
      "args": ["server", "-m", "stream"],
      "trace.server": "verbose",
      "filetypes": ["typescript", "typescriptreact", "graphql"]
    }
  }

動作確認

動作確認にgraphql-rubyを使って実装した簡単なsandbox的なgraphql サーバーを使った。

github.com

Graphqlのクライアントのルートに graphqlのschemaやdocumentの設定を .graphqlrc.ymlというファイルに書いておく。今回はdocumentの設定は必要ないので省略している。

the-guild.dev

schema: 'http://localhost:3000/graphql'

以下のようなqueryを叩くようなクライアントの実装で確認してみる。

import { request, gql } from "graphql-request";

const query = gql`
  {
    authors {
      id
    }
  }
`;

request("http://localhost:3000/graphql", query).then((data) =>
  console.log(data)
);