How to use expo-font - 10 common examples

async function loadResourcesAsync() {
  await Promise.all([
    Asset.loadAsync([
      require('./assets/images/robot-dev.png'),
      require('./assets/images/robot-prod.png'),
    ]),
    Font.loadAsync({
      // This is the font that we are using for our tab bar
      ...Ionicons.font,
      // We include SpaceMono because we use it in HomeScreen.js. Feel free to
      // remove this if you are not using it in your app
      'space-mono': require('./assets/fonts/SpaceMono-Regular.ttf'),
    }),
  ]);
}

import 'node-libs-react-native/globals';
import { Platform, StyleSheet } from 'react-native';
import * as Font from 'expo-font';

// Configure expo-font to load .ttf files
// See: https://github.com/expo/expo/tree/master/packages/expo-font
StyleSheet.setStyleAttributePreprocessor('fontFamily', Font.processFontFamily);

// Polyfill ECMAScript Internationalization API on Android
// See: https://github.com/facebook/react-native/issues/19410
if (Platform.OS === 'android') {
  require('intl');
  require('intl/locale-data/jsonp/en-US');
}

import App from '../src/view/main-mobile';

module.exports = App;

import 'node-libs-react-native/globals';

// Polyfill ECMAScript Internationalization API on Android
// See: https://github.com/facebook/react-native/issues/19410
import 'intl';
import 'intl/locale-data/jsonp/en-US';

import { StyleSheet } from 'react-native';
import * as Font from 'expo-font';
StyleSheet.setStyleAttributePreprocessor('fontFamily', Font.processFontFamily);

import App from '../src/view/main-mobile';

module.exports = App;

(async () => {
      try {
        await Promise.all([
          Font.loadAsync(Ionicons.font),
        ]);
      } catch (e) {
        console.log({ e });
      } finally {
        setLoaded(true);
      }
    })()
  });

const useLoadAssets = (assets: number[], fonts: FontSource): boolean => {
  const [ready, setReady] = useState(false);
  usePromiseAll(
    [Font.loadAsync(fonts), ...assets.map(asset => Asset.loadAsync(asset))],
    () => setReady(true)
  );
  return ready;
};

private async loadFont() {
    await Font.loadAsync({
      "PokerKings-regular": require("../assets/PokerKings-Regular.ttf")
    });

    this.setState({
      fontLoaded: true
    });
  }

async componentDidMount() {
    Dimensions.addEventListener('change', this.onResize);

    try {
      await Permissions.askAsync(Permissions.CAMERA);
      await Font.loadAsync({
        'insta-strong': Assets.fonts['insta-strong.otf'],
        'insta-neon': Assets.fonts['insta-neon.otf'],
        'insta-typewriter': Assets.fonts['insta-typewriter.ttf'],
        'insta-modern': Assets.fonts['insta-modern.ttf'],
      });
    } catch (error) {
    } finally {
      this.setState({ ready: true });
    }
  }

const cacheFonts = fonts => fonts.map(font => Font.loadAsync(font));

  return fonts.map(font => loadAsync(font));
}

function loadFontsAsync() {
  return Font.loadAsync({
    "CerebriSans-Bold": require("../../assets/fonts/CerebriSans-Bold.ttf"),
    "CerebriSans-Medium": require("../../assets/fonts/CerebriSans-Medium.ttf"),
    "CerebriSans-Regular": require("../../assets/fonts/CerebriSans-Regular.ttf"),
    "CircularStd-Bold": require("../../assets/fonts/CircularStd-Bold.ttf"),
    "CircularStd-Black": require("../../assets/fonts/CircularStd-Black.ttf"),
    "CircularStd-Book": require("../../assets/fonts/CircularStd-Book.ttf"),
    "CircularStd-Medium": require("../../assets/fonts/CircularStd-Medium.ttf")
  });
}