修改 React-Native Android App 包名 | 宇宙よりも遠い場所

February 17, 2017

修改 React-Native Android App 包名

不知道是为什么(大概是依赖太多?),每次执行 react-native init 创建新项目的时候,总是要等个将近 10 分钟的样子…… 对于初学者来说,需要在短时间内创建好多好多好多的项目,这样每次 init 就要浪费好长的时间。用 verbose 模式一看,其实 react-native init 的过程中大部分时间是在安装 node_modules 文件夹里的依赖,那么如果每次要创建新项目的时候保留 node_modules 文件夹,只是复制一份纯净的 android, ios, index.android.js 和 index.ios.js 会省很多的时间。 不过众所周知的是即使这样做的话,如果不做改动的话,这些新项目的 package name 都是相同的,在同一台设备中只能存在一个唯一包名的 App。搜索了一下 React Native 改包名 一类的关键词,找到了一些结果,好像很有道理的样子,照做之后兴高采烈地 react-native run-android 的时候……各种编译出错。于是就在这个基础上,自己踩了一些坑,最后总结出了修改包名的完整过程。

我们知道,例如我们执行 react-native init AwesomeProject 的时候,创建的 App 包名默认是 com.AwesomeProject 。

  1. 首先最容易找到的是 package.json 当中的 name 字段,修改它(其实后来发现修不修改都没有什么关系,因为并没有什么卵用)。
  2. 然后是 android/app 目录下的 build.gradle,这个是 gradle 执行 build 的 config 文件,里面大概 90 行左右,在 defaultConfig 块中有一个 applicationId “com.AwesomeProject”, 修改它。
  3. 修改 android/src/main 目录下的 AndroidManifest.xml ,第 2 行就是了,找到 package=“com.AwesomeProject”,修改之。
  4. 接着就是 android/src/main/java 目录下的东西了。首先这个文件夹中你可以看到 ./com/AwesomeProject 目录,我们先把这个目录下的两个文件移动走,然后放到对应你想要修改的包名的目录。例如这里,我想修改包名为 com.kirainmoe.helloworld,我们就在 android/src/main/java 目录下创建这样的层级目录:./com/kirainmoe/helloworld/ ,然后将两个文件 MainActivity.java 和 MainApplication.java 移动过去。 然后修改 MainActivity.java & MainApplication.java 第一行中的 package com.AwesomeProject; 改掉,改成你想要的包名,记住一定要和前面的对应。

(百度出来的回答到这里结束,然而……)

好了,做到这里之后就尝试了一下 react-native run-android,结果在构建 debug app 的时候,到 :app:compileDebugJavaWithJavac 这一步就报错了:

/path/to/MainApplication.java:20: 错误: 找不到符号 
 return BuildConfig.DEBUG; 
 ^ 
 符号: 变量 BuildConfig 
1 个错误 
 FAILED 
FAILURE: Build failed with an exception. 
 
* What went wrong: 
Execution failed for task ‘:app:compileDebugJavaWithJavac’. 
> Compilation failed; see the compiler error output for details. 
 
* Try: 
Run with — stacktrace option to get the stack trace. Run with — info or — debug option
 to get more log output. 
 
BUILD FAILED 
 
Total time: 1 mins 5.339 secs 
Could not install the app on the device, read the error above for details. 
Make sure you have an Android emulator running or a device connected and have 
set up your Android development environment: 
https://facebook.github.io/react-native/docs/android-setup.html

orz,看看错误信息应该是出在 MainApplication.java 上,这里的内容是:

return BuildConfig.DEBUG;

搜索一下这个错误信息,好像确实有遇到的人,但是这里提出的解决方案是针对 Android Studio 下的……不过其中一句话启发了我:

BuildConfig类是在编译时自动生成的,分为debug和release两个版本,路径是: app/build/source/BuildConfig/Build Varients/package name/BuildConfig 修改包名后,原来使用到BuildConfig类的类,import语句会出错, 把import语句的包名改为修改后的包名或者删除这条import语句(让系统自动补充import语句),调试时提示找不到BuildConfig类 import 修改后的包名.BuildConfig;

最后一句话中提到可以通过 import packageName.BuildConfig; 引入,那么我们也可以带上包名来 return 以解决找不到 BuildConfig 的问题,把刚才的语句修改为:

return your.package.name.BuildConfig.DEBUG;

例如,我可以改成:

return com.kirinmoe.helloworld.BuildConfig.DEBUG;

好了,到此为止,再次执行 react-native run-android ,问题就不再出现了。

Update at 914: 貌似也可以在这个文件里加一句 import your.package.name;,这样也能解决找不到 BuildConfig 的问题。

©2018 YumeのDiary / Published with Hugo / Theme