facebook / facebook/relay

invavirant violation:RealayModernGraphQLTag:Expected a request got fragment

Open
#2,579 3 comments 0 reactions 0 assignees View on GitHub
wontfix
Dominant language
Rust
Stars
19k
Forks
1.9k
PR merge metrics
No merged PRs in 30d

Description

step-1 react-native init myrelay
step-2 npm i react-relay relay
step-3 npm i --dev babel-plugin-relay graphql
step-4 added plugin "plugins": [["relay", { "schema": "data/schema.json" }]] in .babelrc
step-5 downloaded schema get-graphql-schema http://127.0.0.1:5000/graphql > ./data/schema.graphql
step -5 relay-compiler --src ./ --schema ./data/schema.graphql

expected output - output from query. balance in this case

actual output -
![relayerror](https://user-images.githubusercontent.com/20577851/48891628-e241c680-ee61-11e8-9cde-8e9d10778df4.png)

App.js
```

import React, { Component } from "react";
import { QueryRenderer, graphql } from "react-relay";
import environment from "./relay-environment";

export default class App extends Component {
render() {
return (
{
if (error) {
return {error.message};
} else if (props) {
return great!;
}
return Loading;
}}
/>
);
}
}

```

relay-environment.js

```
const { Environment, Network, RecordSource, Store } = require("relay-runtime");

const store = new Store(new RecordSource());

export const fetchQuery = (operation, variables) => {
return fetch("http://127.0.0.1:5000/graphql", {
method: "POST",
headers: {
"Access-Control-Allow-Origin": "*",
"Content-Type": "application/json",
"Access-Control-Allow-Credentials": "true",
"Access-Control-Allow-Methods": "GET,HEAD,OPTIONS,POST,PUT",
"Access-Control-Allow-Headers":
"Origin,Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers"
},
// mode: "no-cors",
body: JSON.stringify({
query: operation.text,
variables
})
}).then(response => {
console.log(response);
return response.json();
});
};

const network = Network.create(fetchQuery);

const environment = new Environment({
network,
store
});

export default environment;
```

.babelrc
```
{
"presets": ["module:metro-react-native-babel-preset"],
"plugins": [["relay", { "schema": "data/schema.json" }]]
}
```

package.json
```
{
"name": "myrelay",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"relay": "relay-compiler --src ./data --schema data/schema.graphql",
"relay:watch": "yarn relay --watch"
},
"dependencies": {
"babel-plugin-relay": "^1.7.0",
"graphql": "^14.0.2",
"react": "16.6.1",
"react-native": "0.57.5",
"react-relay": "^1.7.0",
"relay": "^0.8.0-1",
"relay-compiler": "^1.7.0"
},
"devDependencies": {
"babel-jest": "23.6.0",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.49.2",
"react-test-renderer": "16.6.1"
},
"jest": {
"preset": "react-native"
}
}
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.