title: Error: A navigator can only contain 'Screen' components as its direct children
body: <p>I am new to React Native and I am getting this error, but I am not able to resolve it.</p>
  <p>I am following the tutorial from the main <a href="https://reactnavigation.org/docs/screen-options-resolution/" rel="nofollow noreferrer">react-navigation page</a>, but I am not able to complete it.</p>
  <p>I will appreciate any help. Thanks!</p>
  <pre><code>import * as React from 'react';
  import {Text, View} from 'react-native';
  import {NavigationContainer} from '@react-navigation/native';
  import {createStackNavigator} from '@react-navigation/stack';
  
  function HomeScreen() {
       return (
         &lt;View style={{flex: 1, alignItems: 'center', 
           justifyContent: 'center'}}&gt;
           &lt;Text&gt; Home Screen &lt;/Text&gt;
        &lt;/View&gt;
       );
     }
  
     const Stack = createStackNavigator();
     export default function App() {
       return (
         &lt;NavigationContainer&gt;
           &lt;Stack.Navigator&gt;
             &lt;Stack.Screen name=&quot;Home&quot; component={HomeScreen} /&gt;
           &lt;/Stack.Navigator&gt;
         &lt;/NavigationContainer&gt;
        );
      }
  </code></pre>
  <p><a href="https://i.stack.imgur.com/MnjtJ.png" rel="nofollow noreferrer">Screenshoot error</a></p>