score:0
it takes a little extra work. basically you have to dump a serialized version of the schema to a file on the server side, and then move that file over to the client and include it during babel compilation. facebook has a babel plugin that takes this file and builds it into the bundle in order for relay to know about the schema.
edit: here is a snippet for how to dump the schema file to json
import { graphql } from 'graphql'
import { introspectionquery, printschema } from 'graphql/utilities'
/*
generates json of our schema for use by relay
*/
export default function (schema) {
return new promise((resolve, reject) => {
graphql(schema, introspectionquery).then(result => {
if (result.errors) {
console.error(`error introspecting schema: ${result.errors}`)
reject(new error(result.errors))
} else {
resolve({ json: result, graphql: printschema(schema) })
}
})
})
}
after you obtain that, you have to npm install babel-relay-plugin
and include that in your babel plugins (probably in the webpack config, if you're using that).
Source: stackoverflow.com
Related Query
- From where does Relay fetch the Schema of GraphQL?
- Where does the variable slug comes from in gatsby graphql query?
- Where does the root reducer come from in this redux react example and how does dispatch knows which reducer to go?
- Where does the value count come from in response.json()?
- In React useCallback hook, From where does the parameters come inside the callback function
- From where does reducer get the current state
- What is the proper way to fetch data from server with ReactJS and Flux architecture where no Store presented?
- getStaticProps does not fetch from the url but postman gives it the data I need
- Why does updating state from fetch result updates the whole array of objects while rendering?
- why does this error occur during fetch data from the backend
- Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema
- Where do I fetch initial data from server in a React Redux app?
- In Redux, where does the state actually get stored?
- Invalid options object. Dev Server has been initialized using an options object that does not match the API schema
- How to fetch API data from Axios inside the getServerSideProps function in NextJS?
- Why does react hook throw the act error when used with fetch api?
- How does React know the component is removed from the DOM?
- Where does the logic go with SwiftUI compared to React?
- react-native : Unable to resolve module `tty` from ''.../node_modules/window-size/index.js": Module does not exist in the module map
- In a Jest test where does the window object come from?
- Why does React discard the entire DOM subtree and recreate it from scratch?
- How does Relay / GraphQL 'resolve' works?
- Does React automatically prune components which have had their mount points removed from the DOM?
- Where do the webpack output files from the react-hot-loader go?
- Webpack error: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema
- Auto-generating a graphql schema for relay (Graphene server)
- How do I update the grapqhl cache with urql upon a mutation, where the initial query response does not include the required __typename?
- Does React remove the node with display:none from DOM?
- Aria-hidden does not hide the element from queries
- ValidationError: Invalid options object. CSS Loader has been initialised using an options object that does not match the API schema
More Query from same tag
- TypeError: Cannot read properties of undefined (reading 'source') possible problem with async
- Make scroll to top button with animation in React
- How to pass extra props down to children of arry.map
- React Virtualized - Screen going blank after scrolling a long list of itsm
- Reflux store data rendering with line breaks and tag interpolation ES5
- React Toggle Hook State
- "defaultValue" in react-select does not select option in dropdown but "value" select the option in dropdown
- How to access a child's state in React
- Using a value to compare against an array of objects to return a different value within that object?
- Making dynamic canvas a background to a div using React
- Toggling visibility of array of stateless react components
- EJS Template for webpack plugin 'html-webpack-plugin'
- Css is not rendering when i move from Login page to registration page in Routing
- How to fix "Error: Element type is invalid: "
- React time ago not getting date
- React: incorrect examples of calling Hooks inside loops and nested functions
- Google+ signin button with ReactJS
- With react-router is ite possible to access context from a Route's onEnter prop?
- Retrying failed graphql query with react hooks?
- Immutability-Helper Updating One Property but not Others?
- What link do I call to Amazon s3 when I use axios
- Add prefix to routes in React Router v4
- React Native - Redux : Multiple instances of same state in app
- Does the use of es6 named imports reduce the bundle size when using webpack
- React Typescript error TS2332: type '{...}' is not assignable to type '{...}'
- How to read xml from file inside public directory in react project in React JS?
- How do I make a loading structure when I try to fetch an API? (React.js)
- How To change Font size of element in dark mode in MUI React Framework?
- how to order an array in react native?
- Create react component to conditionally wrapping children