最近一直在使用react native中,遇到了很多的坑,同时也学习到了一些移动端的开发经验。

今天在做一个打包的测试时,遇到了一个问题,打包过程中报错“Error:Error: Duplicate resources”,什么意思呢,就是打包资源有重复,后来查看了一下,发现打包到android/app/src目录下的静态文件重名了。

重现步骤:

1:通过vscode打开项目,运行打包命令

react-native ram-bundle --entry-file index.js --platform android --dev false --bundle-output ./android/app/src/main/assets/index.android.bundle --assets-dest ./android/app/src/main/res/

2:

cd android && ./gradlew assembleRelease

查看android/app/src/mian/res/drawable目录下静态资源图片文件名重复

解决方案

1:打开node_modules/react-native/react.gradle文件,在doFirst块下添加doLast块

doLast {
def moveFunc = { resSuffix ->
File originalDir = file("$buildDir/generated/res/react/release/drawable-${resSuffix}");
if (originalDir.exists()) {
File destDir = file("$buildDir/../src/main/res/drawable-${resSuffix}");
ant.move(file: originalDir, tofile: destDir);
}
}
moveFunc.curry("ldpi").call()
moveFunc.curry("mdpi").call()
moveFunc.curry("hdpi").call()
moveFunc.curry("xhdpi").call()
moveFunc.curry("xxhdpi").call()
moveFunc.curry("xxxhdpi").call()
}

2:打开node_modules/react-native/local-cli/bundle/assetPathUtils.js文件,修改getAndroidAssetSuffix函数方法如下

function getAndroidAssetSuffix(scale: number): string {
switch (scale) {
case 0.75: return 'ldpi-v4';
    case 1: return 'mdpi-v4';
    case 1.5: return 'hdpi-v4';
    case 2: return 'xhdpi-v4';
    case 3: return 'xxhdpi-v4';
    case 4: return 'xxxhdpi-v4';
}
throw new Error('no such scale');
}

3:删除android/app/src/main/res/drawable-**目录下面打包进去的静态资源文件(文件名会比较长)

4:如果采用android studio进行打包,点击build下clean project,清除打包缓存

5:重新执行打包命令即可打包成功。

参考资料:

1:https://github.com/facebook/react-native/issues/22234

2:https://blog.csdn.net/wyw223/article/details/84311733

react native中一次错误排查 Error:Error: Duplicate resources的更多相关文章

  1. React Native中的网络请求fetch和简单封装

    React Native中的网络请求fetch使用方法最为简单,但却可以实现大多数的网络请求,需要了解更多的可以访问: https://segmentfault.com/a/1190000003810 ...

  2. 在React Native中,使用fetch网络请求 实现get 和 post

    //在React Native中,使用fetch实现网络请求 /* fetch 是一个封装程度更高的网络API, 使用了Promise * Promise 是异步编程的一种解决方案 * Promise ...

  3. 在 React Native 中使用 Redux 架构

    前言 Redux 架构是 Flux 架构的一个变形,相对于 Flux,Redux 的复杂性相对较低,而且最为巧妙的是 React 应用可以看成由一个根组件连接着许多大大小小的组件的应用,Redux 也 ...

  4. react native中如何往服务器上传网络图片

    let common_url = 'http://192.168.1.1:8080/'; //服务器地址 let token = ''; //用户登陆后返回的token /** * 使用fetch实现 ...

  5. React Native 中 CSS 的使用

    首先声明,此文原作者为黎 跃春 React Native中CSS 内联样式 对象样式 使用Stylesheet.Create 样式拼接 导出样式对象 下面的代码是index.ios.js中的代码: / ...

  6. react native中的欢迎页(解决首加载白屏)

    参照网页: http://blog.csdn.net/fengyuzhengfan/article/details/52712829 首先是在原生中写一些方法,然后通过react native中js去 ...

  7. [转] 「指尖上的魔法」 - 谈谈 React Native 中的手势

    http://gold.xitu.io/entry/55fa202960b28497519db23f React-Native是一款由Facebook开发并开源的框架,主要卖点是使用JavaScrip ...

  8. [转] 在React Native中使用ART

    http://bbs.reactnative.cn/topic/306/%E5%9C%A8react-native%E4%B8%AD%E4%BD%BF%E7%94%A8art 前半个月捣腾了一下Rea ...

  9. react native中使用echarts

    开发平台:mac pro node版本:v8.11.2 npm版本:6.4.1 react-native版本:0.57.8 native-echarts版本:^0.5.0 目标平台:android端收 ...

随机推荐

  1. MySSL HTTPS 评级 B 升 A+

    背景 MySSL 提供了免费的网站 HTTPS 安全评级服务,然后我用我的网站 https://hellogithub.com,测试了一下.发现安全评级为 B,最高为 A+.下面是记录我的网站从 B ...

  2. OAuth2.0记录

    阮一峰老师讲解OAuth2.0 http://www.ruanyifeng.com/blog/2014/05/oauth_2_0.html 举例详解: https://www.cnblogs.com/ ...

  3. 4.JAVA-数组、String详解

    1.数组 public class Test{ public static void main(String args[]){ int[] intArray = new int[] {1,4,3,2, ...

  4. Java对字符串加密并返回星号※

     If you don't look back, you'll never know I waiting for you behind you. Java对字符串加密并返回星号※ PasswordUt ...

  5. Eclipse4JavaEE安装SpringBoot

    第一步:下载SpringBoot SpringBoot官网下载链接 第二步:在Eclipse里进行安装 打开Eclipse,菜单栏Help ->Install New Software,进入下图 ...

  6. CODING Pages 服务全面升级,更快更稳更可靠!

    尊敬的 CODING 用户: 您好! 由于原上游服务商无法满足 CODING Pages 日益增长的用户量以及访问速度需求,同时提供的 DDoS 解决方案无法支撑大型 DDoS 攻击,给 CODING ...

  7. 2、自动化运维之SaltStack远程执行详解

    SaltStack远程执行详解 ●目标(Targeting) ●模块(Module) ●返回(Returnners) 混合模式-C 选项 主机名设置参照: redis-node1-redis03-id ...

  8. redis发布订阅Java代码实现

    Redis除了可以用作缓存数据外,另一个重要用途是它实现了发布订阅(pub/sub)消息通信模式:发送者(pub)发送消息,订阅者(sub)接收消息. 为了实现redis的发布订阅机制,首先要打开re ...

  9. Visual Studio高效实用的扩展工具、插件

    说明: 对一个有想法的程序员来说,善于使用一款高效的开发工具是很重要的,今天给大家介绍的是宇宙第一IDE vs用起来很不错的开发工具,假如大家觉得不错也可以尝试的用用,毕竟对于我们这些一天一大半的时间 ...

  10. Identity Server 4 - Hybrid Flow - MVC客户端身份验证

    预备知识 可能需要看一点点预备知识 OAuth 2.0 不完全简介: https://www.cnblogs.com/cgzl/p/9221488.html OpenID Connect 不完全简介: ...