開発サーバーが応答エラーコード：500 - React Nativeを返しました

Question

React Nativeを使用してAndroidアプリを開発しています。私は表示されている画面のシンプルなコードを実行しようとしましたが、次のようなメッセージが表示されますerror私はすべてのコマンドラインウィンドウとエミュレータを閉じて、React Nativeパッケージを再起動して実行しようとしましたが、うまくいきませんでした。

index.android.js：

import React, { Component} from 'react'; 
import {Text, View, AppRegistry,Button} from 'react-native'; 
import {StackNavigator} from 'react-navigation'; 

import dhrumil from '.\dhrumil.js'; 

export default class MainApp extends Component{ 
render(){ 
    return(
    <dhrumil /> 
); 
} 

} 

const SimpleApp = StackNavigator({ 
    Home: {screen: dhrumil } 
}); 


AppRegistry.registerComponent("MainApp",()=>SimpleApp); 

dhrumil.js：

import React, { Component} from 'react'; 
import {Text, View, AppRegistry,Button,StyleSheet} from 'react-native'; 

const dhrumil =() =>{ 

    return(
    <View style={styles.container}> 
    <Text style={styles.texter}>Hello World!</Text> 
    <Button 
     onPress={() => navigate('dharmin')} 
     title="Chat with Lucy" 
     /> 
     </View> 
); 
} 

const styles = StyleSheet.create({ 
    container:{ 
    justifyContent: 'center', 
    alignItems: 'center', 
    flex: 1 
    } 
    texter: 
    { 
    fontSize: 20, 
    textAlign: 'center' 
    } 
}); 


dhrumil.navigationOptions = { 
    title:'dhrumil' 
} 
export default dhrumil 

私はこれをどのように解決するのですコードが下方に設けられていますか？

Answer 1

index.android.jsimport dhrumil from '.\dhrumil.js';をimport dhrumil from './dhrumil';に変更してください。パスを指定するには/を使用する必要があり、jsファイルをインポートするときにはdhrumil.jsを使用する必要はありません。

Answer 2

@Jeffrey Rajanの提案はここでは絶対に正しいです。

このエラーが原因に主に発生します。 問題1：

1. 使用してファイル名
2. で間違ったケースを使用してインポート文
3. で間違ったファイル名「\」の代わりに「/」ファイル名には

このリストを使用して、このコードを原因とするエラーを簡単に見つけることができます。

問題2：材料と 問題は、これは使用してローカルに材料設計をインストール解決design.To：

react-native-material-design

問題3： バベル・プリセット・反応するネイティブづくりのトラブルコード。この問題を解決するには、次のコマンドを実行してください。

yarn remove babel-preset-react-native 

yarn add babel-preset-react-native@2.1.0 

この問題を解決するには、問題1が問題を解決してください。