apollo codegenの型定義生成メモ

apollo install

2020/04/02時点ではapollo 2.25.0であった。

$ yarn add apollo

apollo.config.js

includes には、Query を書いているファイルを glob で指定する。
型定義の他、VSCodeの拡張等がapollo.client.jsを読んでqueryの補完等を行ってくれる。

Apollo schema registry を使用する場合

module.exports = {
  client: {
    includes: ["./src/**/*.tsx", "./src/**/*.ts"],
    service: "my-apollo-service"
  }
};

エンドポイントからスキーマをリンクする場合

module.exports = {
  client: {
    includes: ["./src/**/*.tsx", "./src/**/*.ts"],
    service: {
      name: "service-name",
      url: "https://sample.com/graphql/"
    }
  }
};

ローカルファイルからスキーマをリンクする場合

module.exports = {
  client: {
    includes: ["./src/**/*.tsx", "./src/**/*.ts"],
    service: {
      name: "service-name",
      localSchemaFile: "./path/to/schema.graphql"
    }
  }
};

コマンド実行

{
  "scripts": {
    "codegen": "apollo client:codegen src/types/api.d.ts --useReadOnlyTypes --addTypename --target=typescript --outputFlat"
  }
}

yarn run codegen

参考

Configuring Apollo projects - Apollo Basics - Apollo GraphQL Docs