时间戳

首页 > 解决方案 > React Native - 无法解决模块 - 即使路径正确

javascript - React Native - 无法解决模块 - 即使路径正确

问题描述

所以我尝试在 React Native 的 javascript 代码中使用一些图像。这是我的文件夹： 在此处输入图像描述

一旦我尝试使用以下命令导入它：

import React from 'react';
import { Image, StyleSheet, View } from 'react-native';
import { SimpleAnimation } from 'react-native-simple-animations';
//here i try to import my picture
import iconBright from 'testproject/pictures/iconBright.png';


export default function Welcome() {
  return (
    <View style={styles.container}>
    <SimpleAnimation delay={500} duration={1000} fade staticType='zoom'>
     //also here i am trying to import it but same error
    <Image source={require('testproject/pictures/iconBright.png')}></Image>
    </SimpleAnimation>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {

  },
});

当我编译它时，我总是得到这个错误：

Unable to resolve "pictures/iconBright.png" from "screens\Welcome.js"

我从互联网和其他 stackoverlow 建议中尝试了许多不同的方法，但没有任何效果。我也试过：

但没有任何效果。有人可以帮助我或解释一下这个路径系统是如何工作的，因为我还没有找到任何有用的指南。

编辑：这里设备上的错误：

Unable to resolve module `../pictures/iconBright.PNG` from `screens\Welcome.js`: 

None of these files exist:
  * pictures\iconBright.PNG(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json|.ios.wasm|.native.wasm|.wasm)
  * pictures\iconBright.PNG\index(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json|.ios.wasm|.native.wasm|.wasm)

标签： javascriptreact-nativepath

解决方案

您的图像是 .PNG 大写，在导入时它是 .png

我会将图像重命名为 .png 并尝试

推荐阅读