(0 , _reactNavigation.createAppContaner) is not a function Evaluating App.js Loading App.js

I write code for google sign in.

expo react-native

I cannot solve this issue:

(0 , _reactNavigation.createAppContaner) is not a function  Evaluating App.js  Loading App.js

app.js

import LoginScreen from "./screens/LoginScreen";import ProfileScreen from "./screens/ProfileScreen";// react Navigation Setupimport { createAppContaner, createSwitchNavigator } from "react-navigation";const MainNavigator = createSwitchNavigator({Login: { screen : LoginScreen },Profile: { screen: ProfileScreen }});const App = createAppContaner(MainNavigator);export default App;

./screens/LoginScreen

import React, { Component } from 'react';import { Text, View, StyleSheet, Button } from 'react-native';import * as Google from 'expo-google-app-auth';const IOS_CLIENT_ID ='375911328301-jlsms1k99gtk8qlcnkd6asqkrpsahphe.apps.googleusercontent.com';//const ANDROID_CLIENT_ID =//  "YOURCLIENTID";export default class LoginScreen extends Component {signInWithGoogle = async () => {try {  const result = await Google.logInAsinc({    isoClientId: IOS_CLIENT_ID,    //androidClientId:ANDROID_CLIENT_ID,    success: ['profile', 'email'],  });  if (result.type === 'success') {    console.log('LoginScreen.js', result.user.giveName);    this.prop.navigation.navigate('Profile', {      username: result.user.giveName,    }); // after google login rederect to profile    return result.accessToken;  } else {    return { cancelled: true };  }} catch (error) {  console.log('LoginScreen.js', error);  return { error: true };}};render() {return (<View style={styles.container}><Button title="Login" onPress={this.signInWithGoogle} /></View>);}}const styles = StyleSheet.create({container: {flex: 1,backgroundColor: '#FFF',alignItem: 'center',justifyContent: 'center',},});

./screens/ProfileScreen

import React, { Component } from "react";import {Text, View, StyleSheet, Button} from "react-native";export default class ProfileScreen extends Component{render(){    return(<View style={styles.container}><Text> profilescreen </Text><Text style={{ fontSize: 20 , fontWeight:"bold" }}> welcome, {this.props.navigation.getParam("username")}</Text><Button title="sign out" onPress={() => this.props.navigation.navigate("Login")}/></View>    )}}const styles = StyleSheet.create({container:{    flex:1,    backgroundColor: "white",    alignItem : "center",    justifyContent: "center"}});

I need it for my university project