当尝试使用Apploading插入Expo中的自定义字体时,我会获得语法错误,“这些文件都不存在”。

发布于 2025-02-02 20:06:39 字数 1838 浏览 1 评论 0原文

我正在尝试将自定义字体插入React Native Expo中。我正在使用Apploading方法。由于某种原因,我收到一条错误消息,说“这些文件都不存在”

...即使文件目录中确实存在文件:

我的博览会版本是5.4.0。我已经寻找类似的问题,但是它们要么不涉及字体,要么使用字体异步而不是应用程序加载。

这是我下面的完整代码。

import 'react-native-gesture-handler';
import React from 'react';
import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';
import HomeScreen from './src/screens/HomeScreen'; 

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import AppLoading from 'expo-app-loading';
import { useFonts } from 'expo-font';
import { Font } from 'expo'; 

const Stack = createStackNavigator();


export default function App() {
  
  
  let [fontsLoaded] = useFonts({
    'SEGOEUI': require('./assets/fonts/SEGOEUI.TTF'),
    }); 

    if (!fontsLoaded) {
      return <AppLoading />;
    }
   

  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Home" screenOptions={{ headerShown: false }}>
        <Stack.Screen name="Home" component={HomeScreen} /> 
      </Stack.Navigator>
    </NavigationContainer>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

I am trying to insert a custom font into React Native Expo. I am using the AppLoading method. For some reason, I get an error message saying "None of these files exist"
enter image description here
enter image description here

...even though the file clearly does exist in the file directory:
enter image description here

My Expo version is 5.4.0. I've looked for similar questions, but they either don't involve fonts, or they are using font Async rather than AppLoading.

This is my full code below.

import 'react-native-gesture-handler';
import React from 'react';
import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';
import HomeScreen from './src/screens/HomeScreen'; 

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import AppLoading from 'expo-app-loading';
import { useFonts } from 'expo-font';
import { Font } from 'expo'; 

const Stack = createStackNavigator();


export default function App() {
  
  
  let [fontsLoaded] = useFonts({
    'SEGOEUI': require('./assets/fonts/SEGOEUI.TTF'),
    }); 

    if (!fontsLoaded) {
      return <AppLoading />;
    }
   

  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Home" screenOptions={{ headerShown: false }}>
        <Stack.Screen name="Home" component={HomeScreen} /> 
      </Stack.Navigator>
    </NavigationContainer>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

冷弦 2025-02-09 20:06:39

尝试添加要加载到Metro.config.js文件的字体文件的文件扩展名类型

应该看起来像这样:

module.exports = {
   transformer: {
      assetPlugins: ["expo-asset/tools/hashAssetFiles"],
   },
   resolver: {
      assetExts: [
         "db",
         "mp3",
         "ttf", //<-- this is the one you want
         "obj",
         "png",
         "jpg",
         "jpeg",
         "mp4",
         "jfif",
         "otf",
      ],
   },
};

try adding the file extension type of the font file you are trying to load to the metro.config.js file

should look something like this:

module.exports = {
   transformer: {
      assetPlugins: ["expo-asset/tools/hashAssetFiles"],
   },
   resolver: {
      assetExts: [
         "db",
         "mp3",
         "ttf", //<-- this is the one you want
         "obj",
         "png",
         "jpg",
         "jpeg",
         "mp4",
         "jfif",
         "otf",
      ],
   },
};
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文