2016-05-18 19 views
9

Sto provando a configurare un progetto React Native Relay di base. Sto creando questo problema dopo aver speso un sacco di tempo a provare il debug del problema senza fortuna. Ricevo questo avviso su console e la mia app nativa non è in grado di effettuare chiamate al server GraphQL.Non riesco a far funzionare Relay con React Native

Warning: RelayNetworkLayer: Call received to injectImplementation(), but a layer was already injected. 


Running application "ExampleApp" with appParams: {"rootTag":1,"initialProps":{}}. __DEV__ === true, development-level warning are ON, performance optimizations are OFF 

fetchWithRetries(): Still no successful response after 1 retries, giving up. 

Ecco il mio codice

index.ios.js

import React, { Component } from 'react'; 
import Relay from 'react-relay'; 

import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View 
} from 'react-native'; 
import App from './app'; 
import AppRoute from './route/appRoute'; 

Relay.injectNetworkLayer(
    new Relay.DefaultNetworkLayer("http://localhost:1337/graphy") 
); 

class ExampleApp extends Component { 
    render() { 
    return (
     <Relay.RootContainer 
     Component={App} 
     route={new AppRoute()} 
     /> 
    ); 
    } 
} 

AppRegistry.registerComponent('ExampleApp',() => ExampleApp); 

appRoute.js

'use strict'; 

import Relay from 'react-relay'; 

export default class extends Relay.Route { 
    static queries = { 
    page: (Component) => Relay.QL` 
     query { 
     posts(offset: 0) { ${Component.getFragment('page')} } 
     } 
    `, 
    }; 

    static routeName = 'AppRoute'; 
} 

app.js

'use strict'; 

import React, {Component} from 'react'; 
import Relay from 'react-relay'; 

import { 
    View, 
    Text, 
} from 'react-native'; 

class App extends Component { 

    render() { 
    console.log('props', this.props); 
    return(
    <View> 
     <Text>Testing</Text> 
    </View> 
    ); 
    } 
} 


export default Relay.createContainer(App, { 
    fragments: { 
    page:() => Relay.QL` 
     fragment on Viewer { 
     posts { id, title } 
     } 
    `, 
    } 
}); 

package.json

{ 
    "name": "ExampleApp", 
    "version": "0.0.1", 
    "private": true, 
    "scripts": { 
    "start": "node node_modules/react-native/local-cli/cli.js start" 
    }, 
    "dependencies": { 
    "babel": "^6.5.2", 
    "babel-preset-react-native": "^1.8.0", 
    "babel-relay-plugin": "^0.8.1", 
    "react": "^0.14.8", 
    "react-native": "^0.25.1", 
    "react-relay": "^0.8.1" 
    } 
} 

babelRelayPlugin.js

const getBabelRelayPlugin = require('babel-relay-plugin'); 
const schema = require('../schema.json'); 

module.exports = { plugins: [getBabelRelayPlugin(schema.data)] }; 

Ecco il link repo completo: https://github.com/popstand/react-native-relay-graphql-example

codice simile costruito con ReactJS e relè funziona bene sulla pagina web. Non sono in grado di farlo funzionare su React Native. Che cosa potrebbe andare storto qui che causa questo problema?

risposta