I keep getting this error: error screenshot

Here is the code that im using to import my custom google fonts:

import React, { useState } from "react";

import Home from "./screens/home";

import { View } from "react-native";

import * as Font from "expo-font";

import { AppLoading } from "expo";



const getFonts = () =>

  Font.loadAsync({

    "poppins-regular": require("./assets/fonts/Poppins-Regular.ttf"),

    "poppins-bold": require("./assets/fonts/Poppins-Bold.ttf"),

  });



export default function App() {

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

  if (fontsLoaded) {

    return <Home />;

  } else {

    return (

      <AppLoading startAsync={getFonts} onFinish={() => setFontsLoaded(true)} />

    );

  }

}

Here is my Json Package:

{

  "main": "node_modules/expo/AppEntry.js",

  "scripts": {

    "start": "expo start",

    "android": "expo start --android",

    "ios": "expo start --ios",

    "web": "expo start --web",

    "eject": "expo eject"

  },

  "dependencies": {

    "expo": "~40.0.0",

    "expo-splash-screen": "^0.8.1",

    "expo-status-bar": "~1.0.3",

    "react": "16.13.1",

    "react-dom": "16.13.1",

    "react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",

    "react-native-web": "~0.13.12"

  },

  "devDependencies": {

    "@babel/core": "~7.9.0"

  },

  "private": true

}

I can't seem to find the error or fix it. I did this with another project before and it worked. The getting the font info is exactly the same. The only thing i can think of is maybe my packages are outdated atm? but Im not sure which package to even update.

Can someone please help?