React Native Fonts Not work in expo project - react-native

Question

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
Check the render method of App.
This error is located at:
in App (created by withDevTools(App))
in withDevTools(App)
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
in main(RootComponent)
App.js
import { View, Text } from 'react-native'
import React, { useState } from 'react';
import { NavigationContainer } from '#react-navigation/native';
import { createNativeStackNavigator } from '#react-navigation/native-stack';
import HomeScreen from './pages/HomeScreen';
import { Font, AppLoading } from 'expo';
const Stack = createNativeStackNavigator();
const loadFonts = async () => {
return Font.loadAsync({
"open-sans": require("./assets/fonts/OpenSans-Regular.ttf"),
"open-sans-bold": require("./assets/fonts/OpenSans-Bold.ttf")
});
};
function App() {
const [fontLoaded, setFontLoaded] = useState(false);
if (!fontLoaded) {
return (
<AppLoading
startAsync={loadFonts}
onFinish={() => setFontLoaded(true)}
/>
);
}
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen name="Home" component={HomeScreen}/>
</Stack.Navigator>
</NavigationContainer>
)
}
export default App;
HomeScreen
import { View, Text, SafeAreaView, StatusBar } from 'react-native'
import React from 'react';
import Header from './../components/Header';
import { Colors } from '../Values';
function HomeScreen() {
return (
<SafeAreaView style={{flex: 1, backgroundColor: Colors.bg}}>
<StatusBar backgroundColor={Colors.bg} barStyle={'dark-content'}/>
<Header/>
</SafeAreaView>
)
}
export default HomeScreen;
package.json
{
"name": "myapp",
"version": "1.0.0",
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web"
},
"dependencies": {
"#expo/vector-icons": "^13.0.0",
"#react-navigation/drawer": "^6.5.7",
"#react-navigation/native": "^6.1.2",
"#react-navigation/native-stack": "^6.9.8",
"expo": "~47.0.12",
"expo-status-bar": "~1.4.2",
"native-base": "2.13.8",
"react": "18.1.0",
"react-native-safe-area-context": "4.4.1",
"react-native-screens": "~3.18.0"
},
"devDependencies": {
"#babel/core": "^7.12.9"
},
"private": true
}
I am solving error but not solve.
Solve my question