react-native 打包流程

问题

react-native方便了移动端app组件的开发,但是其社区以来的expo jdk 在某些业务场景下不足以满足某些需求,我们需要将其与原生app进行整合,共同打包发布,但rn官方文档中对于此方面的描述并不详尽。

分析

使用react-native的开发者,大多数是没有原生开发经验的,而将react-native与原生应用进行整合则必须要对原生应用开发流程由一定了解,因此在条件允许的条件下,这部分工作可交由原生开发人员完成。
但是如果android工程师的条件无法满足,则需要前端工程师自己完成,幸好,这部分工作并不十分需要非常深入的原生知识,只需要了解构建工具的简单使用即可。

解决

在此以 android studio 为例来说明如何将react-native应用打包成android apk

1.创建react-native应用
create-react-native-app helloworld
2.将开发环境结构为可定制模式
yarn eject
3.打开android studio ,从当前目录下的android子目录导入应用
react-native 打包流程_第1张图片
选择导入新应用

react-native 打包流程_第2张图片
选择第一步创建好的应用目录下的android子目录
3.打包jsBundle

原生应用会提供js运行环境,因此实际上还是要将应用代码打包为一个js文件,实际运行时也是在js解释器的帮助下执行,也因此与原生应用存在一定的性能差距。
回到命令行执行以下命令:

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

回到android studio 项目中,进行如下图所示的操作:


react-native 打包流程_第3张图片
选择build操作
react-native 打包流程_第4张图片
打包完成提示
react-native 打包流程_第5张图片
打包好的app

以上就是一个简单的打包react-native为android apk的过程,其中还有许多个性化的配置方案可供选择,比如是否允许开发模式等等,这些需要读者们自己去探索

你可能感兴趣的:(react-native 打包流程)