Couldn't find a 'component', 'getComponent' or 'children' prop for the screen 'OnboardPage'

Question

I have been struggling with the code below. Here is the error.

enter image description here

This is my OnboardPage.js

import React, { Component } from 'react';
import {
    View,
    StyleSheet,
    Button,
    Text
} from 'react';
import { render } from 'react-dom';
import { TouchableOpacity } from 'react-native';

const OnboardPage = () => {
    return(
        <View>
           <Text>
               OnboardPage
           </Text>
        </View>
    );
};

export { OnboardPage };

This is my App.js

import { StatusBar } from 'expo-status-bar';
import * as React from 'react';
import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';

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

import OnboardPage from './Screens/OnboardPage';

const Stack = createStackNavigator();

const App = () => {

  return(
    <NavigationContainer>
      <Stack.Navigator initialRouteName= {"OnboardPage"}>
        <Stack.Screen name = "OnboardPage" component = {OnboardPage} />
      </Stack.Navigator>
    </NavigationContainer>
  )
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

export default App;

I don't know what's happening. I have tried several fixes from here and then decided to post myself as none of them are working.

Answer 1

This occur as a result of how you are exporting the OnboardingScreen.so basically when you use the "export default " you must import it using this syntax import Onboarding from ""./Onboarding

//pattern one 
//Onboarding.js
export const OnboardPage = () => {
 //your code goes here
};
//App.js
import {Onboarding} from './Onboarding'

//Pattern Two
//Onboarding.js
export default function(){}
//App.js
 import Onboarding from './Onboarding';

Emphasis are on the import and export.I also do recommend looking up Named export vs default export