Font.loadAsync不加载字体，因此显示了splash。

Question

加载字体已经有几天没有工作了，我找不到原因，而且世博会有其他问题，需要很长时间才能加载，而且由于某种原因，在exp发布应用程序之后没有任何更新，有人知道原因吗？

在开发期间(6个月)没有问题，但是两天前由于某种原因字体中断了，我找不到的原因

​

如果删除字体加载，则加载应用程序。

“expo”："4.11.0"，

“博览会”："~40.0.0"，

“世博-应用程序加载”："^1.0.1"，

"react"："16.13.1"，

“react dom”："16.13.1"，

“react原生”："https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz"，“

Answer 1

*在我的例子中，在使用世博go时，我注意到如果(我的手机和我的计算机)的时钟不同步，加载AppLoading需要很长时间。

*如果有帮助的话，我将向您展示如何在我的应用程序中加载字体，我正在使用的是：

“世博”："^41.0.0"，

“世博-应用程序加载”："^1.1.2"，

“世博字体”："~9.1.0"，

"react"："16.13.1"，

“react dom”："16.13.1"，

“react原生”："https://github.com/expo/react-native/archive/sdk-41.0.0.tar.gz"，“

 const fetchFonts = async () => {
     return await Font.loadAsync({
        'gotham-narrow-black':{
             uri: require('./assets/fonts/gotham/GothamNarrow-Black.otf'),
             display: Font.FontDisplay.FALLBACK
        },
        'gotham-narrow-book':{
             uri: require('./assets/fonts/gotham/GothamNarrow-Book.otf'),
             display: Font.FontDisplay.FALLBACK
        },
        'gotham-ultra':{
             uri: require('./assets/fonts/gotham/Gotham-Ultra.otf'),
             display: Font.FontDisplay.FALLBACK
        },
       'gotham-light':{
             uri: require('./assets/fonts/gotham/GothamLight.otf'),
             display: Font.FontDisplay.FALLBACK
        },
       'gotham-book':{
             uri: require('./assets/fonts/gotham/Gotham-Book.otf'),
             display: Font.FontDisplay.FALLBACK
        },
  })
}

export default function App() {
  const [fontLoaded, setFontLoaded] = useState(false);
  if(!fontLoaded) {
    return <AppLoading 
      startAsync = { fetchFonts }
      onError = { console.warn }
      onFinish = { () => setFontLoaded(true) }
    />
  }
  return <MainApp />;
}

Answer 2

由于字体是静态文件，因此必须更改fontLoading函数。

改变这个

import Helvetica from './Helvetica.ttf';

const useFonts = async () =>
  await Font.loadAsync({
    Helvetica: Helvetica, // not like this
  });

到这个

const useFonts = async () =>
  await Font.loadAsync({
    Helvetica: require('./Helvetica.ttf'), // correct location
  });

因此，在您的情况下，将您的loadFonts函数改为

const loadFonts = async () =>
  await Font.loadAsync({
    montserratRegular: require('./assets/Montserrat-Regular.ttf'),
    montserratBold: require('./assets/Montserrat-Bold.ttf'),
    montserratSemiBold: require('./assets/Montserrat-SemiBold.ttf'),
    montserratMedium: require('./assets/Montserrat-Medium.ttf'),
  });