React-Native Image加载本地图片报错error: bundling failed: Error: Unable to resolve module

最新推荐文章于 2024-12-18 11:44:41 发布
原创 最新推荐文章于 2024-12-18 11:44:41 发布 · 3.7k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文探讨了在React Native中加载本地图片时遇到的问题及解决方案。作者通过调整图片路径解决了跨文件夹层级引用图片的问题。

在初步学习React-Native 用Imgae加载本地的时候 遇到了这个问题，代码是这样的


在根目录下的images文件夹内有backicon.png这张图片

按上面配置的路径,在代码中是可以定位到图片的，但是实际运行测试就报错找不到这个图片，后来测试才发现要这样写

改成这样之后可以正常运行，原因是引用该图片的Login.js与图片的文件夹层级不同，需要跳到同一级才能找到，不过为什么不加../../也能点出该图片路径还没弄清楚。

zpswz
关注
安装动画插件报错Error: Failed to initialize react-native-reanimated library, make sure you
九段刀客的博客
11-24 567
react-native清空缓存
【报错问题】使用 react-native-image-picker 报错Caused by org.gradle.api.internal.artifa
窝窝头的博客
05-22 973
目录： 版本说明 报错内容 解决办法 一、版本说明 本机系统： Mac react: "16.8.3" react-native: "0.59.9" react-native-image-picker: "0.27.0" node: 12.16.2 # node -v npm: 6.14.4 # npm -v 二、运行项目时，使用了 react-native-image-picker 插件后，构建安卓环境，报以下错误 Caused by: org.gradle.api.in
React Native中Image报错Missing request token for request: <NSMutableURLRequest: 0x..>{URL:...png}
spicyboiledfish的博客
08-11 4043
首先贴出来报错： 这个问题，是因为用Image组件请求网络图片的时候，每刷新十次会有一次没有请求到，偶然出现的报错。 解决这类问题，一定要对图片的URL地址进行判空： 源码供上： { Filter.isNotEmpty(this.props.upgradeObj) && Filter.isNotEmpty(this.props.upgradeObj.imgUrlPath)
error: bundling failed: Error: Unable to resolve module `./ant-design/react-native` from `App.js`:
Qg520jungle的博客
08-10 1316
None of these files exist: ant-design\react-native(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx) ant-design\react-native\index(.native|.android.js|.native.js|.js|.android.json
react native 路径对，但读取图片错误问题
spfLinux的博客
01-30 1725
import React,{Component} from 'react'; import {Image,View} from 'react-native'; export default class Demo03Component extends Component{ constructor(){ super(); this.state={
react-native bundling failed: Error: Unable to resolve module /../react-transform-hmr/lib/index.js
CFPP_45的博客
10-11 1068
报错是因为js server没有正常启动。 react-native版本： 在一个终端执行 react-native start --reset-cache（我加了端口是应为默认的8081端口被无赖强制占用，我换成9043） 在另一个终端执行 react-native run-android  app编译正常，js server正常启动 参考 https://blog.c...
ReactNative报错bundling failed: Error: Unable to resolve module `AccessibilityInfo`
sinat_25017107的博客
08-02 2693
最近根据RN中文网使用RN初始化一个项目时，会出现这个报错 使用react-native init Demo(项目名称)这个命令行时，得到的package.json里的依赖包版本是这样的 "dependencies": { "react": "16.4.1", "react-native": "0.56.0" }, "devDependencies": {
React Native error: bundling failed: Error: Unable to resolve module `AccessibilityInfo` from...问题解决
pcaxb的专栏
08-31 3478
转载请注明预见才能遇见的博客：http://my.youkuaiyun.com/ 原文地址：https://blog.youkuaiyun.com/pcaxb/article/details/82258292 React Native error: bundling failed: Error: Unable to resolve module `AccessibilityInfo` from...问题解决 目录 ...
ReactNative android打包报错Task :react-native-amap3d:compileReleaseKotlin FAILED
像树的博客
08-31 2092
问题描述： ReactNative android打包报错：Task :react-native-amap3d:compileReleaseKotlin FAILED 截图如下： 关键句： Kotlin could not find the required JDK tools in the Java installation '/Library/Internet Plug-Ins/JavaAppletPlugin.plugin/Contents/Home' used by Gradle. Make su
报错记录 | Error: Cannot find module ‘react-dev-utils/crossSpawn’
01-07
Error: Cannot find module 'react-dev-utils/crossSpawn' at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15) at Function.Module._load (internal/modules/cjs/loader.js:562:25) ...
React Native学习之Image加载本地图片的坑(iOS)
weixin_34185560的博客
12-29 2196
在使用Image加载本地图片碰到一个小坑，在这里记录下。 import React, { Component } from 'react'; import { AppRegistry, StyleSheet, Text, View, Image } from 'react-native'; export default class BillProject extends Compone...
【React Native运行打包命令报错：error Unable to resolve module ...】
最新发布
weixin_43690623的博客
12-18 899
在 TypeScript 的 tsconfig.json 配置了路径别名后，React Native 中并不会直接识别 TypeScript 配置的路径别名，需要通过 Babel 和 Metro Bundler 配置来处理路径别名
react 加载img 出错 使用onError事件
曹焱的博客
10-11 8399
{ title: &lt; div className = { styles.tableTeCenter } &gt; 图片 &lt; /div&gt;, dataIndex: 'images', width:240, sorter: (a, b) =&gt; (a.createDate || 0) - (b.createDate || 0), rende...
react img加载失败触发onError
前端小跑堂的博客
04-06 1682
react img加载失败触发onError <img alt={head} className={styles.item_image_vatar} src="getHead.png" onError={(e) => { e.target.src = "default.png" }} />
React-Native图片加载问题
xjl271314的博客
05-03 1438
加载本地图片： 加载本地图片，推荐使用require方式 &lt;Image source={ require('../assets/1.png') } /&gt; 默认Image会去根据设备的分辨率自动匹配图片的大小，所以把1@2x.png 和1@3x.png同时放在assets目录下，而显示的时候不需要跟上@后面的文本，不然显示会报错。 加载网络图片 &lt;Image source...
React-Native 安卓出现图片资源路径正确，却无法加载显示
lzm150的博客
09-22 6342
其实是个小坑哈哈哈，一直在代码层面找原因，浪费了不少时间。 没什么技术含量，就是包安卓的包文件并不会每次都把图片资源重新打包。也就是说，你第一次打完包之后，再更新图片与代码，代码是会生效，但是图片文件是拿不到的。 去../android/app/src/main/assets文件夹中把包文件删除，然后重新运行run android 打包即可加载出最新的图片资源了。
ReactNative中安卓上加载图片遇到的问题
weixin_45672971的博客
09-24 590
问题描述： 在RN中，首次进入页面或清空缓存后，点击TouchableOpacity中包裹的图标进行图标切换操作（已经将动画效果去掉，通过标识判断该显示哪一张图片），图标还会出现动画效果，并且只有第一次会出现，但图标切换一个遍后，动画就会消失恢复正常。 原因分析： 只有安卓中第一次进入页面和清空缓存的情况下才会发生这种情况，盲猜是安卓缓存机制的原因，点击的时候才回去加载应该显示的那张图片，导致出现一次动画效果，而再次点击就没有这个问题。 解决方案： 提前加载图片，在要切换的图标前面将所有的图
React Native加载图片详解
热门推荐
flyingpig2016的博客
07-25 1万+
一：Image组件的基本用法1.1从当前项目(即本地)中加载图片 <View style={styles3.container}> <Text>加载本地图片</Text> <Image source={require('./img/1.jpg')} style={styles3.img1} /> </View>这时候的图片可以放在根目录，也就是和inde
React-Native/Android 显示本机图片/设备内存文件目录中的图片
violin256的博客
04-24 1177
想在React-Native 项目中，用Image标签显示本地图片,我的真机测试中，手机的根目录有image文件夹，image文件夹有名字为1.jpg的图片，想要显示该图片，但是路径如下却显示不了。 <Image style={{width: 400, height: 200}} source={{uri: `file:///image/1.jpg`}} /> 解决办法 路径加上"storage/emulated/0/" import { Image} from "react-n
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值