npm

Need private packages and team management tools?Check out npm Orgs. »

next-graphql-react

3.2.0 • Public • Published

graphql-react logo

next-graphql-react

npm version Build status

Next.js config and App decorators for graphql-react, enabling server side rendered GraphQL operations.

Setup

To install next-graphql-react and the graphql-react peer dependency from npm run:

npm install next-graphql-react graphql-react

See the withGraphQLConfig and withGraphQLApp examples to get started.

Support

Consider polyfilling:

API

Table of contents

function withGraphQLApp

A higher-order React component to decorate a Next.js custom App component in pages/_app.js for graphql-react, enabling descendant GraphQL operations with server side rendering and client side data hydration.

It also forwards HTTP Link headers with the following rel parameters from GraphQL responses received when ssr runs to the Next.js page response:

Link URLs are forwarded unmodified, so avoid sending relative URLs from a GraphQL server hosted on a different domain to the app.

Parameter Type Description
App object Next.js custom App component.

Returns: WithGraphQL — Next.js custom App higher-order component.

See

Examples

A custom App.

In pages/_app.js:

import 'cross-fetch/polyfill'
import { GraphQLProvider } from 'graphql-react'
import { withGraphQLApp } from 'next-graphql-react'
import App, { Container } from 'next/app'
 
class CustomApp extends App {
  render() {
    const { Component, pageProps, graphql } = this.props
    return (
      <Container>
        <GraphQLProvider graphql={graphql}>
          <Component {...pageProps} />
        </GraphQLProvider>
      </Container>
    )
  }
}
 
export default withGraphQLApp(CustomApp)

function withGraphQLConfig

A higher-order function to decorate a Next.js custom config in next.config.js for graphql-react, that excludes server only graphql-react/server and next-graphql-react/server/LinkHeader imports from the client bundle.

Parameter Type Description
config object Next.js custom config.

Returns: object — Next.js custom config.

See

Examples

A custom config.

In next.config.js:

const { withGraphQLConfig } = require('next-graphql-react/server')
 
module.exports = withGraphQLConfig({
  // Custom config…
})

install

npm i next-graphql-react

Downloadsweekly downloads

224

version

3.2.0

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability