Tengo un problema con react-native. Estoy tratando de hacer ejercicio para hacer la aplicación de tareas pendientes de cómo veo las lecciones de YouTube. ¿No puedo entender dónde está mi culpa? El instructor de Youtuber codifica todos iguales, su código funciona pero mi código no funciona.

Este es el archivo app.js:

 import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; import Task from './components/Task'; export default function App() { return ( <View style={styles.container}> <View style={styles.taskWrapper}> <Text style={styles.sectionTitle}>Today Works</Text> <View style={styles.items}> <Task text={'Task1'} /> <Task text={'Task2'} /> </View> </View> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#E8EAED', }, taskWrapper: { paddingTop: 80, paddingHorizontal: 20, }, sectionTitle: { fontSize: 24, fontWeight: 'bold', }, items: { }, });

y este es el archivo /components/Task.js;

 import React from 'react'; import { View, Text, StyleSheet } from 'react-native'; import { TouchableOpacity } from 'react-native-web'; const Task = (props) => { return( <View style={styles.item}> <View style={styles.itemLeft}> <TouchableOpacity style={styles.square}></TouchableOpacity> <Text style={styles.itemText}>{props.text}</Text> </View> <View style={styles.circular}></View> </View> ) } const styles = StyleSheet.create ({ itemLeft: { }, square: { }, itemText: { }, circular: { }, }); export default Task;

Esos códigos no funcionan.

Recibí estos errores en la exposición; Puedes ver el error aquí>

¿Qué es mi culpa?