react native render error (view config getter callback for component 'div'?

Question

I have a problem with react-native. I'm trying exercise to do todo app from how I watch on youtube lessons. Can't understand where is my fault? Youtuber instructor codes all of same, his code working but my code doesn't working.

This is app.js file:

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: {

  },
});

and this is /components/Task.js file;

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;

That codes not working.

I got these errors in expo ; You can see error here>

What is my fault?

Answer 1

You are importing TouchableOpacity from 'react-native-web' (maybe because of intellisense). The compiler is then filling that with a <div> instead of a <View>. Change it to just 'react-native'.