升级到 Expo SDK 51 后，静态图像未加载“<ImageBackground>”

Question

我最近将我的 Expo 项目从 SDK 50 升级到 SDK 51，现在使用

<ImageBackground>

组件时我的静态图像无法加载。此前，此设置在 SDK 50 中运行良好，但升级后，它仅通过 uri 属性加载图像。这是说明问题的代码片段：

这有效：

import { ImageBackground } from "react-native";

<ImageBackground
  source={{ uri: "https://some-url/background.png" }}
  resizeMode="cover"
  style={styles.background}
>
// some code here
</ImageBackground>

这不起作用：

import { ImageBackground } from "react-native";

<ImageBackground
  source={require("../../assets/image.png")}
  resizeMode="cover"
  style={styles.background}
>
// some code here
</ImageBackground>

在 Expo SDK 50 中，第二个片段完美运行。升级到SDK 51后，不再显示静态图片。

package.json 中的依赖关系：

"dependencies": {
  "@react-native-async-storage/async-storage": "1.21.0",
  "@react-navigation/bottom-tabs": "^6.5.19",
  "@react-navigation/drawer": "^6.6.14",
  "@react-navigation/native": "^6.1.16",
  "@react-navigation/native-stack": "^6.9.25",
  "@reduxjs/toolkit": "^2.2.1",
  "axios": "^1.6.7",
  "expo": "^51.0.8",
  "expo-location": "~16.5.5",
  "expo-status-bar": "~1.11.1",
  "expo-updates": "~0.24.12",
  "react": "18.2.0",
  "react-native": "0.73.5",
  "react-native-element-dropdown": "^2.10.2",
  "react-native-gesture-handler": "~2.14.0",
  "react-native-gifted-chat": "^2.4.0",
  "react-native-keyboard-aware-scroll-view": "^0.9.5",
  "react-native-maps": "1.10.0",
  "react-native-paper": "^5.12.3",
  "react-native-reanimated": "~3.6.2",
  "react-native-root-toast": "^3.5.1",
  "react-native-safe-area-context": "4.8.2",
  "react-native-screens": "~3.29.0",
  "react-native-svg": "14.1.0",
  "react-native-tab-view": "^3.5.2",
  "react-native-vector-icons": "^10.0.3",
  "react-native-webview": "13.6.4",
  "react-native-youtube-iframe": "^2.3.0",
  "react-redux": "^9.1.0",
  "redux-persist": "^6.0.0",
  "uuid": "^9.0.1"
}

Answer 1

为什么不对图像使用 import 语句？也许就是这样！

import { ImageBackground } from "react-native";
import Image from "../../assets/image.png";

<ImageBackground
  source={Image}
  resizeMode="cover"
  style={styles.background}
>
// some code here
</ImageBackground>