Question

这些字体在我的资产文件夹中，它们也位于xcode副本捆绑资源中，也位于资源文件夹中。我也已经运行了react-native链接，但是它仍然找不到字体。有什么我想念的吗？请参阅所附图片以供参考：

在此处输入图片描述

Answer 1

反应本机部分：

将字体添加到assets/fonts项目的根文件夹的react-native

react-native-project/
  package.json
  ios/
  android/
  assets/
    fonts/
      GROBOLD...
      ...

将以下代码段添加到package.json

"rnpm": {
  "assets": [
    "./assets/fonts/"
  ]
}

在您的react-native项目中运行以下命令以链接您的资产。

react-native link react-native-vector-icons

iOS部分：

检查info.plist中的字体文件是否已添加。

删除派生数据，构建并运行Xcode项目。

通过导航到AppDelegate.m文件再次检查添加到项目中的字体，并在NSURL *jsCodeLocation下面添加以下代码行；

for (NSString* family in [UIFont familyNames])
{
  NSLog(@"%@", family);
  for (NSString* name in [UIFont fontNamesForFamilyName: family])
  {
    NSLog(@" %@", name);
  }
}

Android部分：

如果字体文件尚不存在，则将其复制到。

android/
    app/
      src/
        main/
          assets/
            fonts/
              GROBOLD...

Answer 2

请在下面更新您的代码：

"rnpm": {
    "assets": [
      "./src/assets/fonts/"
    ]
  }

您错过了“ /”，这就是编译器找不到字体文件的原因。

让我知道您是否仍然遇到任何问题。

Answer 3

'rnpm' 在版本 > 0.60 中已弃用，并将在主要版本中完全删除。

请按照以下步骤开始在您的 React Native 应用程序中使用自定义字体

在根目录下创建react-native.config.js

在 react-native.config.js 中添加以下代码

module.exports = {
  assets: ['./assets/fonts']
};

在终端中，运行 npx react-native link 命令
为组件添加样式e.g. <Text style={styles.titleText}>Home Screen</Text>
在标题中添加以下属性 titleText: { fontFamily: 'name-of-font-without-ttf-extension'}
运行您的应用npx react-native run-android / run-ios
您会看到新字体添加到您的应用中。

React Native无法识别的字体家族未修复

3 个答案: