title: Can't run custom component in React native
body: <p>Need some help with React Native. Searched in Google, but didn't find any solution.
   I have one project which works on android. Here code:</p>
  
  <pre><code>  import React, { Component } from 'react';
      import {
        AppRegistry,
        StyleSheet,
        Text,
        View
      } from 'react-native';
      export default class MyApp extends Component {
        render() {
          return (
            &lt;View style={styles.container}&gt;
              &lt;Text style={styles.welcome}&gt;
                Welcome to React Native!
              &lt;/Text&gt;
              &lt;Text style={styles.instructions}&gt;
                To get started, edit index.android.js
              &lt;/Text&gt;
              &lt;Text style={styles.instructions}&gt;
                Double tap R on your keyboard to reload,{'\n'}
                Shake or press menu button for dev menu
              &lt;/Text&gt;
            &lt;/View&gt;
          );
        }
      }
  
      const styles = StyleSheet.create({
        container: {
          flex: 1,
          justifyContent: 'center',
          alignItems: 'center',
          backgroundColor: '#F5FCFF',
        },
        welcome: {
          fontSize: 20,
          textAlign: 'center',
          margin: 10,
        },
        instructions: {
          textAlign: 'center',
          color: '#333333',
          marginBottom: 5,
        },
      });
  
      AppRegistry.registerComponent('MyApp', () =&gt; MyApp);
  </code></pre>
  
  <p>But when i try to add my own component it  like this:</p>
  
  <pre><code>import React, { Component } from 'react';
  import {
    AppRegistry,
    StyleSheet,
    Text,
    View
  } from 'react-native';
  import MainPage from "./app/components/MainPage/MainPage";
  
  export default class MyApp extends Component {
    render() {
      return (
        &lt;View style={styles.container}&gt;
          &lt;Text style={styles.welcome}&gt;
            Welcome to React Native!
          &lt;/Text&gt;
          &lt;Text style={styles.instructions}&gt;
            To get started, edit index.android.js
          &lt;/Text&gt;
          &lt;Text style={styles.instructions}&gt;
            Double tap R on your keyboard to reload,{'\n'}
            Shake or press menu button for dev menu
          &lt;/Text&gt;
  
          &lt;MainPage/&gt;
        &lt;/View&gt;
      );
    }
  }
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
      backgroundColor: '#F5FCFF',
    },
    welcome: {
      fontSize: 20,
      textAlign: 'center',
      margin: 10,
    },
    instructions: {
      textAlign: 'center',
      color: '#333333',
      marginBottom: 5,
    },
  });
  
  AppRegistry.registerComponent('MyApp', () =&gt; MyApp);
  </code></pre>
  
  <p>i get error in emulator:
  <a href="https://i.stack.imgur.com/rbVCx.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rbVCx.jpg" alt="enter image description here"></a></p>
  
  <p>Can somebody help?
  Code for component MainPage:</p>
  
  <pre><code>import React, {Component} from 'react';
  import {AppRegistry, StyleSheet, View, Text} from 'react-native';
  
  export default class MainPage extends Component {
      render() {
          return (
              &lt;View&gt;
                  &lt;Text style={styles.welcome}&gt;
                      Welcome to React Native!
                  &lt;/Text&gt;
  
              &lt;/View&gt;
          );
      }
  }
  
  MainPage.propTypes = {}
  
  MainPage.defaultProps = {}
  
  const styles = StyleSheet.create({
      welcome: {
          fontSize: 20,
          textAlign: 'center',
          margin: 10,
      }
  });
  
  AppRegistry.registerComponent('MainPage', () =&gt; MainPage);
  </code></pre>