graphql-config

The easiest way to configure your development environment with your GraphQL schema (supported by most tools, editors & IDEs)

TLDR: Set an environment variable called GRAPHQL_ENDPOINT to your GraphQL endpoint (e.g. https://your.api/graphql) or read ahead for other configuration options.

Supported by...

Editors

• js-graphql-intellij-plugin - GraphQL language support for IntelliJ IDEA and WebStorm, including Relay.QL tagged templates in JavaScript and TypeScript (pending)
• atom-language-graphql - GraphQL support for Atom text editor (pending)

Tools

• babel-plugin-react-relay - Babel compile step to process your Relay.QL queries
• babel-plugin-transform-relay-hot - Wrapper under BabelRelayPlugin with hot reload (pending)
• eslint-plugin-graphql - An ESLint plugin that checks tagged template strings against a GraphQL schema (pending)
• webpack-plugin-graphql-schema-hot - Webpack plugin which tracks changes in your schema and generates its introspection in json and txt formats (pending)

Did we forget a tool/editor? Please add it here.

Usage

You can either configure your GraphQL endpoint via a configuration file or by providing an environment variable.

Note: This requires Node 5 installed or higher

Method 1: Configuration via $GRAPHQL_ENDPOINT environment variable

The easiest way to configure your project is by setting an environment variable called GRAPHQL_ENDPOINT to your GraphQL endpoint.

export GRAPHQL_ENDPOINT="https://your.api/graphql"

You can also configure headers with the GRAPHQL_HEADERS environment variable. The value must be a valid JSON string.

export GRAPHQL_HEADERS="{\"Authorization\":\"xxxxx\"}"

Method 2: Configuration via .graphqlrc file

You can either use your actual GraphQL endpoint or if preferred a local schema.json or schema.js file.

Use GraphQL endpoint

Note: The headers object is optional and can for example be used to authenticate to your GraphQL endpoint.

{
  "request": {
    "url": "https://example.com/graphql",
    "headers": {
      "Authorization": "xxxxx"
    }
  }
}

Use local schema file (JSON)

{
  "file": "./schema.json"
}

Use local schema file (GraphQL.js)

{
  "graphql-js": "./schema.js"
}

Method 3: Configuration via package.json file

Use the same configuration options as for the .graphqlrc file but wrap it into an object with the key graphql.

{
  "dependencies": { ... },
  "graphql": {
    "request": {
      "url": "https://example.com/graphql"
    }
  }
}

How it works

This project aims to be provide a unifying configuration file format to configure your GraphQL schema in your development environment.

Additional to the format specification, it provides the graphql-config-parser library, which is used by all supported tools and editor plugins. The library reads your provided configuration and passes the actual GraphQL schema along to the tool which called it.

In case you provided a URL to your GraphQL endpoint, the graphql-config-parser library will run an introspection query against your endpoint in order to fetch your schema.

graphql-config-parser API

import { parse, resolveSchema } from 'graphql-config-parser'

const config = parse()
resolveSchema(config)
  .then((schema) => {
    // use json schema for your tool/plugin
  })
  .catch((err) => {
    console.error(err)
  })

Help & Community

Join our Slack community if you run into issues or have questions. We love talking to you!