Skip to main content

Relay Environment

Config Relay Environment​

pnpm add relay-runtime
pnpm add -D @types/relay-runtime
import {
  Environment,
  Network,
  RecordSource,
  Store,
  FetchFunction,
} from 'relay-runtime'

const fetchRelay: FetchFunction = async (params, variables) => {
  console.log(`fetching query ${params.name} with ${JSON.stringify(variables)}`)

  const response = await fetch('https://relay-doc-backend.vercel.app/api/graphql', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      query: params.text,
      variables,
    }),
  })

  return response.json()
}

export const relayEnvironment = new Environment({
  network: Network.create(fetchRelay),
  store: new Store(new RecordSource()),
})

Alternatives​

react-relay-network-modern​

Open source Relay Environment with lots of build-in plugins