React-Native工程项目打包编译 发布流程详解

转载：https://www.aliyun.com/jiaocheng/35793.html

摘要： 具体看一下Android和IOS两个平台是如何执行发布产品。 

React-Native之Android平台发布两种方式:  方式一是借助于命令行,  方式二种是借助于Android Studio进行。

步骤: 

方式二: 借助Android Studio发布。

a). 首先借助于Android Studio生成 keystore签名文件。

 

•  点击下一步, 创建一个新的keystore, 这里无需关心后缀名字,默认即可。
  
  
  上面主要是密码, 建议全部设一个密码,方便记忆,  Alias这个不要忘记,最好把上面信息复制一份,选定一个自己熟悉的路径,点击OK保存。此时keystore生成完毕。 
  
  此时,你会发现,你可以继续生成一个apk, 并且可以安装,但是却无法运行,发生闪退。 
  这是因为React-Native的android平台下默认没有生成资源文件，也就是我们所有的js图片文件等等。 
  
  b).下面我们就来生成JS Bundle文件: 
  第一步,我们在android的main文件夹下面建一个assets文件在工程目录下。也可以通过命令行操作。(在项目根目录执行此命令即可) 
  [code]mkdir -p Android/app/src/main/assets 
  
  第二步,生成Bundle文件。此命令同样在根目录执行,如下图: 
  [code]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/ 
  
  
  此时,我们已经完全生成了bundle文件了, 你可以查看自己工程assets下的文件夹。 
  然后再一次进行打包,这次选择已经创建的keystore, 输入alia和密码,生成apk, 进行安装, 测试正常运行。 
  
   

方式二: 命令行发布版本

     1. 切换到你的工程根目录下

       

     2. 生成秘钥签名

$ keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

  这里的第一个SuperBigLw就是文件的名字，第二个是别名。

10000是有效时间，2048是RSA加密的大小

按提示输入信息用户密码等等。

 

     2.设置gradle变量

把 my-release-key.keystore文件 放到你工程中的android/app文件夹下。 
编辑~/.gradle/gradle.properties（没有这个文件你就创建一个），添加如下的代码（注意把其中的**替换为相应密码）

MYAPP_RELEASE_STORE_FILE=my-release-key.keystore
MYAPP_RELEASE_KEY_ALIAS=my-key-alias
MYAPP_RELEASE_STORE_PASSWORD=*****
MYAPP_RELEASE_KEY_PASSWORD=*****

    3. 添加签名到项目的gradle配置文件

...
android {
    ...
    defaultConfig { ... }
    signingConfigs {
        release {
            storeFile file(MYAPP_RELEASE_STORE_FILE)
            storePassword MYAPP_RELEASE_STORE_PASSWORD
            keyAlias MYAPP_RELEASE_KEY_ALIAS
            keyPassword MYAPP_RELEASE_KEY_PASSWORD
        }
    }
    buildTypes {
        release {
            ...
            signingConfig signingConfigs.release
        }
    }
}
...

      4.生成发行APK包

cd android && ./gradlew assembleRelease

        cd android表示进入android目录（如果你已经在android目录中了那就不用输入了）。./gradlew assembleRelease在macOS和Linux系统中表示执行当前目录下的名为gradlew的脚本文件，运行参数为assembleRelease，注意这个./不可省略；而在windows命令行下则需要去掉./。

React-Native之IOS平台发布

相对于Android平台来讲，IOS平台的发布操作相对简单，只需要简单配置即可，具体的来看一下：

第一步选择Product ⇒ Archive

生成导出后的ipa即为最终文件！

总结

总体来讲，React-Native的发布流程主要借助于原生Native的开发工具，具体操作也比较简单，只是部分注意事项稍加注意即可，比如android平台默认是没有生成bundle资源文件的，生成apk后会闪退等等。