Windows10环境下React Native打包的个人实践

参考文档：
ReactNative 中文网
ReactNactive qq群
搭建React Native for Android Windows开发环境
   最近刚刚升级了win10，发现win10环境下开发有不小的问题。主要就是管理员权限这个非常不友好的设定，导致node.js和Editplus、notepad++都出现了些问题，所以使用cmd 或者是开发工具全最好都去勾选一下管理员权限，我在用npm命令初始化rn项目时 就因为权限问题导致一直失败，原因就是npm的缓存目录设置在本地账户\AppData下，即使我给cmd授予了管理器权限依然没有作用，又看到说没有c++环境，于是又跑去装了visual Studio2015，结果还是各种报错一直没法初始化项目。
  我怀疑是我网速的问题，重新安装了node.js v4.3.1 。这次改为淘宝源来安装npm，经过折腾现在已经可以正常打包，但是可能是服务器的原因 现在没法连上服务器更新代码，还再找原因。

windows 搭建React Native

安装node.js

Node.js

安装 visual Studio

编译Node.js需要C++环境， 还要安装python ，否则在init的命令时可能会警告你。

配置环境变量

Node.js

path

;C:\Program Files (x86)\nodejs\

AndroidHome

变量名 ：ANDROID_HOME
变量路径：D:\AndroidStudioSDK
path：;%ANDROID_HOME%;%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools

---

参考用具体需要看自己的安装路径

安装npm

1.安装：npm install -g cnpm --registry=https://registry.npm.taobao.org
2.测试安装成功：cnpm info connect

这个如果有淘宝源的话安装还是比较快的，

初始化项目

cd到工作空间
然后
react-native init MyFirstProject 

这个安装需要较长的时间也是最容易出问题的步骤，如果安装失败可以跳过这部分直接去ReactNative.cn去下载纯净版的目录 ：纯净工作目录。我遇到到的一个主要问题就是缓冲的问题，因为无权缓冲在本地AppData目录内，所以一直报错，解决办法是设置npm的缓冲路径：

npm congig set cache "D:\cache"

如果没遇到问题可以省略这个步骤。

运行

首先cd到刚才init的目录 然后：

//启动服务
react-native start 

启动完成服务后需要重新打开一个cmd窗口，执行

//运行debug到安卓手机上（模拟器也行）使用的是adb
react-native run-android

这个命令需要很长的时间去下载gradle构建项目，构建成功后会自动安装到手机上，然后晃动手机 选择 Dev Setting去设置电脑服务器的ip，设置完成后选择 reload Js重新加载代码 。本地通过android.index.js修改代码，完成后再reload js即可看到更新。

安卓打包

1、 首先在工程目录里 执行 mkdir android\app\src\main\assets 这目录是为了存储稍后的离线包。
2、使用 keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000 申请一个keyStore
3、设置gradle变量 将 （2）申请到的keystore文件放到android\app目录下
编辑 \ android \gradle.properties，添加如下的代码（注意：请把其中的** 替代为替换的keystore密码）

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

4.添加签名到应用的gradle配置文件
编辑你工程目录下的android/app/build.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
        }
    }
}

5、cd 到 项目根目录 MyFirstProject位置

运行
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/

这个 命令的意思就是生产 index.android.bunlde 离线包文件，
位置就在第一步 android\app\src\main\assets目录内
但是实际根据我的测试 即使不使用此命令签名apk一样可以正常使用。
6、cd 到 \android 目录下 使用gradle命令打签名包：

gradlew assembleRelease 

打包成功后会在 android\app\build\outputs\apk内 找到app-release.apk 就是签名apk。
7、使用gradlew installRelease 来安装签名包 进行测试。

---

不执行第5步一样可以将最新的js代码打包到apk中 具体原因有待调查。