Tevin Rivera Tevin Rivera - 20 days ago 14
iOS Question

REACT-NATIVE SyntaxError unterminated JSX contents (57:41)

Help, Im trying code an app an I can't seem to get past this error.

var React = require('react-native');

var {
View,
Text,
StyleSheet
} = React;

var styles = StyleSheet.create({
mainContainer: {
flex: 1,
padding: 30,
marginTop: 65,
flexDirection: 'column',
justifyContent: 'center',
backgroundColor: '#48BBEC'
},
title: {
marginBottom: 20,
fontSize: 25,
textAlign: 'center',
color: '#fff'
},
searchInput: {
height: 50,
padding: 4,
marginRight: 5,
fontSize: 23,
borderWidth: 1,
borderColor: 'white',
borderRadius: 8,
color: 'white'
},
buttonText: {
fontSize: 18,
color: '#111',
alignSelf: 'center'
},
button: {
height: 45,
flexDirection: 'row',
backgroundColor: 'white',
borderColor: 'white',
borderWidth: 1,
borderRadius: 8,
marginBottom: 10,
marginTop: 10,
alignSelf: 'stretch',
justifyContent: 'center'
},
});

class Main extends React.Component{
render(){
return (
<View style={styles.mainContainer}>
<Text> Testing the Router </Text>
</View>
)
}
};

module.exports = Main;


I believe the problem lies in this block

class Main extends React.Component{
render(){
return (
<View style={styles.mainContainer}>
<Text> Testing the Router </Text>
</View>
)
}
};


There error message is: SyntaxError /Users/tevinrivera/Rondeh/App/Components/Main.js: Unterminated JSX contents(57:41)

Answer

Your imports are wrong. You need to import React from 'react' and other things like View, Stylesheet etc from 'react-native'.

Something like will work:

import React from 'react';

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