fontFamily“Courier”不是系统字体本机基础博览会

Question

我正在使用博览会的原生基本模板

expo-template-native-base

，启动iOS模拟器时出现错误

fontFamily "Courier" is not a system font and has not been loaded through Font.loadAsync.

- If you intended to use a system font, make sure you typed the name correctly and that it is supported by your device operating system.

- If this is a custom font, be sure to load it with Font.loadAsync.
at node_modules/expo-font/build/Font.js:27:16 in processFontFamily
at node_modules/react-native/Libraries/ReactNative/renderApplication.js:54:4 in renderApplication
at node_modules/react-native/Libraries/ReactNative/AppRegistry.js:117:25 in runnables.appKey.run
at node_modules/react-native/Libraries/ReactNative/AppRegistry.js:213:4 in runApplication

关于如何解决这个问题有什么想法吗？

Answer 1

此警告表明您尝试在 Expo 项目中使用的 Courier 字体在设备上不可用，并且您尚未使用

expo-font

将其包含为自定义字体。如果您遇到此问题，可以通过以下方式解决：

1. 安装

   expo-font

   ：

   npx expo install expo-font

2. 下载字体：您可以从 Google Fonts 下载 Courier 字体。我是从fonts-free下载的。
3. 将字体添加到您的 Expo 项目中，并创建一个字体文件夹。通常在项目根目录或资产文件夹中。
4. 导入并加载字体：

import * as Font from 'expo-font';
import { useEffect } from "react";

const loadFonts = async () => {
  await Font.loadAsync({
   Courier: require('./fonts/Courier.ttf'), // Replace with path
  });
};

useEffect(() => {
  loadFonts();
}, []);

5. 在样式中使用该字体，加载字体后，您可以使用其名称（'Courier'）引用它