如何在Android上使用脱机捆绑来反应原生项目?

如何在android上使用脱机捆绑软件?
我没有看到在Android上使用脱机捆绑的文件。
我试图取消build.gradle中的代码注释。

project.ext.react = [ // the name of the generated asset file containing your JS bundle bundleAssetName: "index.android.bundle", // the entry file for bundle generation entryFile: "index.android.js", // whether to bundle JS and assets in debug mode bundleInDebug: false, // whether to bundle JS and assets in release mode bundleInRelease: true, // the root of your project, ie where "package.json" lives root: "../../", // where to put the JS bundle asset in debug mode jsBundleDirDebug: "$buildDir/intermediates/assets/debug", // where to put the JS bundle asset in release mode jsBundleDirRelease: "$buildDir/intermediates/assets/release", // where to put drawable resources / React Native assets, eg the ones you use via // require('./image.png')), in debug mode resourcesDirDebug: "$buildDir/intermediates/res/merged/debug", // where to put drawable resources / React Native assets, eg the ones you use via // require('./image.png')), in release mode resourcesDirRelease: "$buildDir/intermediates/res/merged/release", // by default the gradle tasks are skipped if none of the JS files or assets change; this means // that we don't look at files in android/ or ios/ to determine whether the tasks are up to // date; if you have any other folders that you want to ignore for performance reasons (gradle // indexes the entire tree), add them here. Alternatively, if you have JS files in android/ // for example, you might want to remove it from here. inputExcludes: ["android/**", "ios/**"] ] 

但它没有工作。它仍然从服务器获取JS捆绑。
有什么我错过了吗?

Solutions Collecting From Web of "如何在Android上使用脱机捆绑来反应原生项目?"

要将JS离线绑定到android,首先在相应的项目path中启动服务器:

  1. 当服务器启动时,打开与项目path相同path的下一个terminal
  2. 复制并粘贴以下命令:在命令propmt中复制和粘贴命令之前,请在项目各自的path中生成assets文件夹
    如:
    Android设备/应用/ src目录/主/资产

    在命令提示符下粘贴这个命令并运行:

      react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/ 
  3. 然后在assets文件夹中会出现文件index.android.bundle

  4. 最后,运行命令:react-native run-android(同时build立新的离线apk,不用启动服务器,离线的js文件会帮你build立apk文件)
  5. 最后,apk现在构build已经准备好在不同的设备上运行(从app / src / build / debug.apk运行apk)。
  6. 有时候新制作的apk会运行而不显示图片,如果应用程序运行时没有图片,则复制并粘贴到android / app / src / main / assets /(图片源文件夹)
  7. 再次运行应用程序,从而构buildapk已准备好运行。

您可以阅读react.gradle的源代码,然后您将知道如何执行脱机捆绑。

react.gradle ,它为每个构build变体创build离线bundle gradle任务,并使其在gradle进程资源之前执行,但在一些特殊情况下启用bundle任务,代码为:

 enabled config."bundleIn${targetName}" || config."bundleIn${buildTypeName.capitalize()}" ?: targetName.toLowerCase().contains("release") 

config对象实际上是react对象,因为它的定义是def config = project.hasProperty("react") ? project.react : []; def config = project.hasProperty("react") ? project.react : [];

并且targetName定义是def targetName = "${productFlavorName.capitalize()}${buildTypeName.capitalize()}"

所以如果我们在app\build.gradle定义一个适当的react属性,我们可以启用脱机捆绑任务。

例如,如果我们想要在release构buildtypes中启用脱机包,而不是在debug构buildtypes中,我们可以将react定义为:

 ext.react = [ bundleInDebug : false, bundleInRelease : true ] 

然后在命令行中执行gradle assembleRelease ,gradle将执行bundle任务,js bundle将包含在最终的apk中。

现在在你的问题中,你已经定义了正确的react对象,但是你没有提到你已经运行了哪个构buildtypes。 只执行gradle assembleRelease可以做捆绑工作,也许你执行gradle assembleDebug所以没有任何意义。

还有一个问题需要说明(另见issue7258 )。 如果你为release版本启用bundle任务并且从android studio运行应用程序,gradle不会执行bundleReleaseJsAndAssets ,因为android studio bundleReleaseJsAndAssets启用Configure on demand (在File | Settings | Build,Execution,Deployment | Compiler中)为了加速构build,并且在react.gradle ,当所有项目被configuration(或者称为评估)时,捆绑任务被添加到项目中,因为主代码在gradle.projectsEvaluated{}块中。

按需configuration模式尝试仅configuration与请求任务相关的项目,即只执行参与构build的项目的build.gradle文件。

由于某些不清楚的原因,在启用“ Configure on demandfunction时,不会执行gradle.projectsEvaluated{}块中定义的任何任务。 要使其可执行,请禁用android studio设置中的Configure on demandfunction,或将gradle.projectsEvaluated{}更改为afterEvaluate{}

如果在命令行工具中运行gradle assembleRelease ,一切正常,因为Configure on demand默认情况下是禁用的。

你不需要在你的gradle.build文件中取消注释。 它可以作为参考,如果需要,你可以覆盖任何有默认值的值。

问题是Android Studio没有运行负责生成包的任务。

要在Android Studio中解决这个问题,请转到Preferences > Build, Execution, Deployment > Build Tools > Compiler然后取消选中"Configure on demand"

现在,您标记为需要捆绑的任何变体将自动生成捆绑。

默认情况下,debugging变体不会生成bundle: bundleInDebug : false

你可以改变这个。 这里我还提供了如何更改入口点的缺省位置和包的默认名称的示例。

 project.ext.react = [ bundleAssetName: "index.myapp.bundle", entryFile: "js/index.myapp.js", bundleInDebug: true ] 

一旦你做了这些调整,你可能仍然遇到问题的build设,因为Studio不能识别你的shellconfiguration文件的path,所以我可能找不到节点的path。

我在这里发布了一个解决scheme

这是一个稳定和健壮的解决scheme。 一旦在env中进行了这些更改,您不必手动执行任何操作。 当您按下IDE中的button时,Bundle将自动生成,并允许您select适当的构build变体(也位于Studio窗口左下angular的IDE中)。

用APK签名发布。

我尝试使用未签名的APK文件并安装,但是当我去安装在我的Android平板电脑上,它给了我一个Failure [INSTALL_PARSE_FAILED_NO_CERTIFICATES]的错误Failure [INSTALL_PARSE_FAILED_NO_CERTIFICATES]

我想这是因为APK文件没有签名,平板电脑不满意这一点。 因此,在生成React Native包文件后,我可以像平常一样通过Android Studio生成签名的APK文件。

顺便说一句,我们的应用程序是一个function齐全的Android应用程序,已经存在于Play商店中,我们只是将一些React Native添加到它中,因为它太棒了。

所以总结一下,这里是我的步骤:

1)生成React Native bundle:

 react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/<your-package-name>/src/main/assets/index.android.bu‌​ndle --assets-dest android/<your-package-name>/src/main/res/ 

2)从Android Studio生成一个签名APK文件。

3)安装签名APK文件到USB设备:

 adb -d install -r <path_to_signed_apk> 

4)利润!

您可以在ReactApplication类中重写getJSBundleFile()函数以返回自定义文件path。

 @Nullable @Override protected String getJSBundleFile() { return "/your/bundle/path/bundle.file.name.bundle"; } 

之后,只需使用react-native bundle生成软件包,然后将生成软件包放在设备的指定path中即可。