从本地打bundle的方式来显示我们的react native页面。

本篇文章主要介绍Android项目是如何加载本地的RN页面,本地的RN页面这个概念有点类似于本地HTML静态网页,RN是以一个bundle的文件形式加载进来的。由于本篇文章依赖于上篇文章的项目,阅读的人可以从上一篇中的链接中下载本项目按我的步骤进行跑demo。---------项目源码

  上一篇项目中,我们以ReactRootView容器来加载我们jsserver打好的bundle,在项目主目录运行命令react-native start 即可,接下来我们打本地的bundle,放到SD卡上并加载出来。

1,将AndroidStudio中的命令行切换到项目根目录,执行以下打bundle命令:ative bundle --entry-file index.android.js --bundle-output app/src/main/bundle/index.android.bundle --platform android

  注意app/src/main/bundle/是我bundle的输出目录,如果没有的话需要新建。打包完毕会在相应的文件夹中生生一个index.android.bundle的文件,这个就是我们要加载的bundle。

2,将这个index.android.bundle放到手机的SD卡上,

3,在容器ReactRootView,加入以下代码。

从本地打bundle的方式来显示我们的react native页面。_第1张图片
oncreate()方法中加入的代码

最后运行安装就可以了,本篇比较简单,不做太多的描述。

你可能感兴趣的:(从本地打bundle的方式来显示我们的react native页面。)