Неожиданный токен в строке с тегом <image> в React Native

Question

<Image source={require('./cat.jpeg')}/>

У меня есть эта строка внутри функции рендеринга, и когда я запускаю код, я получаю сообщение об ошибке "Неожиданный токен" в этой строке. Как решить эту проблему? Изображение cat.jpeg находится в той же папке, что и текущий компонент.

Вот полный код:

'use strict'
import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Navigator,
  Text,
  View,
  Image
} from 'react-native';

import { Actions } from 'react-native-router-flux';


export default class HomeScreen extends Component{



  render() {
    return (
            <View style={styles.container}>
            <View style={styles.rowcontainer}>
            // <Image style={{width: 50, height:50}}
            // source={{uri: 'https://facebook.github.io/react/img/logo_small.png'}}/>
            <Image source={require('./cat.jpeg')}/>

            <Text onPress={Actions.MarkAttendance}style={styles.welcome}>
          Mark Attendance
        </Text>


        <Text onPress={Actions.AttendanceDetails}style={styles.welcome}>
          View Attendance
        </Text>

        </View>

        <View style={styles.rowcontainer}>

        <Text onPress={Actions.Test}style={styles.welcome}>
          Test
        </Text>


        <Text onPress={Actions.NewActivation}style={styles.welcome}>
          New Activation
        </Text>

        </View>
        <View style={styles.rowcontainer}>

        <Text onPress={Actions.PendingAttendance}style={styles.welcome}>
          Pending Attendance
        </Text>


        <Text onPress={Actions.Checkout}style={styles.welcome}>
          Checkout
        </Text>

        </View>
        <View style={styles.rowcontainer}>

        <Text onPress={Actions.Settings}style={styles.welcome}>
          Settings
        </Text>

        <Text style={styles.welcome}>
          Logout
        </Text>

        </View>
        </View>
       )

  }


}


var styles = StyleSheet.create({
  container: {
    flex: 1,
    marginTop:50,
    backgroundColor: '#FFFFFF',
  },
  rowcontainer:{
    alignItems:'stretch',
    flexDirection:'row',
    justifyContent:'space-between',
    margin: 10,
  },
  welcome:{
    fontSize:15,
  }
});

Answer 1

Вы не можете использовать // комментировать фрагменты кода внутри вашей функции рендеринга, используя HTML-подобный синтаксис. Вместо этого попробуйте обернуть все, что вы пытаетесь закомментировать внутри {} и с использованием блочных комментариев javascript там.
например

{/*
    <Image
        source=.../>
*/}