2017-03-28 17 views
0

RNアプリ(create-react-native-appで作成)をセットアップしようとしています。リレー付き。Relay + React Native(create-react-native-app)を使用したときのエラー:GraphQL検証エラー `Unknown Type" Viewer "。

私はすでに私の App.jsで次のセットアップを持っている

:私はGraphQLのAPIからロードされることを期待viewer.idを印刷するための期待

import { StyleSheet, Text, View } from 'react-native' 
import Relay, { 
    Route, 
    RootContainer, 
} from 'react-relay' 
import PokemonList from './components/PokemonList' 

Relay.injectNetworkLayer(
    new Relay.DefaultNetworkLayer('https://api.graph.cool/relay/v1/ciyeih9590fhl0162e5zh1z4h', { 
    headers: { 
    }, 
    }) 
) 

class IndexRoute extends Route { 
    static queries = { 
    viewer:() => Relay.QL`query { viewer }` 
    } 
    static routeName = 'IndexRoute' 
} 

export default class App extends React.Component { 
    render() { 
    return (
     <View style={styles.container}> 
     <RootContainer 
      Component={PokemonList} 
      route={new IndexRoute()} 
      renderFetched={(data) => <PokemonList {...this.props} {...data} />} 
     /> 
     </View> 
    ) 
    } 
} 

PokemonListは、これまで何もしません。

import Relay from 'react-relay' 

class PokemonList extends React.Component { 

    render() { 
    console.log(this.props.viewer.id) 
    return (
     <View> 
     <Text>Hi</Text> 
     </View> 
    ) 
    } 

} 

export default Relay.createContainer(PokemonList, { 
    fragments: { 
    viewer:() => Relay.QL` 
     fragment on Viewer { 
     id 
     } 
    ` 
    } 
}) 

ビルド時にリレーを使用できるようにするには、this babelプラグインを使用しています。

three methodsのいずれかを使用してGraphQLエンドポイントを提供する必要があります。私はそうのような.graphqlrcファイルに設定さ:

{ 
    "request": { 
    "url": "https://api.graph.cool/relay/v1/ciyeih9590fhl0162e5zh1z4h", 
    "headers": { 
     "Authorization": "xxxxx" 
    } 
    } 
} 

そして、これは私の.babelrcは、次のようになります。

:私は、私はこのエラーを取得していますアプリを実行しているとき、しかし

{ 
    "presets": ["babel-preset-expo"], 
    "env": { 
    "development": { 
     "plugins": ["transform-react-jsx-source", "react-relay"] 
    } 
    } 
} 

GraphQL validation error Unknown Type "Viewer". in file .../PokemonList.js . Try updating your GraphQL schema if an argument/field/type was recently added.

Relayが私のスキーマに全くアクセスできないようです。私のセットアップで何が欠けているのか、さらにデバッグするために何ができるのか誰にでも教えてください。

そして、それが誰を助けている場合だけ参考のために、ここに私のpackage.jsonは、次のようになります。答えはかなり簡単だったので、私のセットアップがすでに正しかったようだが、私も削除しなければならなかった、

{ 
    "name": "test", 
    "version": "0.1.0", 
    "private": true, 
    "devDependencies": { 
    "babel-plugin-react-relay": "^0.10.0", 
    "jest-expo": "^0.3.0", 
    "react-native-scripts": "0.0.25", 
    "react-test-renderer": "~15.4.1" 
    }, 
    "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js", 
    "scripts": { 
    "start": "react-native-scripts start", 
    "eject": "react-native-scripts eject", 
    "android": "react-native-scripts android", 
    "ios": "react-native-scripts ios", 
    "test": "node node_modules/jest/bin/jest.js --watch" 
    }, 
    "jest": { 
    "preset": "jest-expo" 
    }, 
    "dependencies": { 
    "expo": "^15.1.0", 
    "react": "~15.4.0", 
    "react-native": "0.42.3", 
    "react-relay": "^0.10.0" 
    } 
} 

答えて

1

[OK]をcrnaキャッシュがあるので、rm -rf $TMPDIR/react*を実行し、iOSシミュレータを再起動すると実際に実行されました。

関連する問題