reactjs - The imported font and the apploading does not work and i get a errror i don´t understand

Question

enter image description here

import React, { useState } from 'react';
import Diary from './components/Diary';
import Explore from './components/Explore';
import Profile from './components/Profile';
import Statistics from './components/Statistics';
import Homepage from './components/Homepage';
import * as Font from 'expo-font';
import { AppLoading } from 'expo';

const getFonts = () => Font.loadAsync({
  'HeptaSlab': require('./assets/fonts/HeptaSlab-ExtraLight.ttf')
});

const App = () => {
  const [fontsLoaded, setFontsLoaded] = useState(false);

  if(fontsLoaded){
    return (
        <Diary />
    );
  } else {
    return (
    <AppLoading
      startAsync={getFonts}
      onFinish={() => setFontsLoaded(true)}
    />
    )
  }

}


export default App;

I want to import a font (line: 7, 10,11,12) and a Apploading(line:8, 15,17,21,21,23,24,25,26) but just gets a error message i don′t understand. What have i missed in my code?

Answer 1

等待大神答复