React Native 说文件不存在

Question

所以，我是 React Native 的新手，我正在尝试构建一个基本的应用程序，但每次我在 Android 模拟器上启动它时，我都会收到一个语法错误，告诉我“这些文件都不存在”并且它指的是一个图像。这是模拟器的屏幕截图，以及我的 VS Code 工作区。 这里是代码，如果有人想复制它并搞乱它。 WelcomeWindow.js：

import React from 'react';
import { ImageBackground } from 'react-native-web';

function WelcomeWindow(props) {
    return (
        <ImageBackground 
        style={styles.background}
        source={require("../assets/background.jpg")}>
            
        </ImageBackground>
    );
}
const styles = StyleSheet.create({
    background: {
        flex: 1,
    }
})

export default WelcomeWindow;

App.js：

import WelcomeWindow from './app/screen/WelcomeWindow';

export default function App() {
  return (
    <WelcomeWindow />
  );
}

我确定路径是正确的，我认为这更像是某个地方的错误，而且我真的不知道如何修复它。我尝试寻找解决方案，并且我遇到了一个消息来源，说这是使用我正在使用的 android studio 时出现的具体问题。再说一遍，我对此也不确定。如果有人可以帮助我，我将不胜感激！

我明白发生了什么事。由于某种原因，ImageBackground 的自动导入来自react-native-web。

Answer 1

import React from 'react';
import { ImageBackground } from 'react-native-web';

它应该只是反应原生的。

import React from 'react';
import { ImageBackground } from 'react-native';

2024 年 10 月，如果您遇到像我一样的错误，请尝试以下步骤。

Answer 2

在根目录下创建一个文件夹

components

1. 创建文件images.js（不是ts）
2. 导入带有扩展名的文件（image.png）在
components
index.js
4. 中创建另一个文件 在index.js中导入图像
import { images } from "../constants";
5. （无论你想去哪里）

6. source={images.logo}