搭建开发环境
参考: https://reactnative.cn/docs/environment-setup
安装node的LTS版本: https://nodejs.org/en/download
添加 C:\nodejs\ 到系统path
# 使用nrm工具切换淘宝源
npx nrm use taobao
# 如果之后需要切换回官方源可使用
npx nrm use npm
Yarn是 Facebook 提供的替代 npm 的工具,可以加速 node 模块的下载。装完 yarn 之后就可以用 yarn 代替 npm 了,例如用yarn代替npm install命令,用yarn add 某第三方库名代替npm install 某第三方库名.
npm install -g yarn
安装jdk17: https://github.com/adoptium/temurin17-binaries/releases/
添加如下路径到系统path: C:\jdk-17.0.9+9\bin
javac --version
javac 17.0.9
安装 Android Studio(可能需要代理), 按默认路径安装(如果安装其他路径,可能会碰到一些设置问题): C:\Program Files\Android\Android Studio
https://developer.android.com/studio?hl=zh-cn
安装界面中选择"Custom"选项,确保选中了以下几项:
Android SDK
Android SDK Platform
Android Virtual Device
Android SDK版本 36
配置 ANDROID_HOME 环境变量: C:\Users\Y\AppData\Local\Android\Sdk
系统path变量增加: C:\Users\Y\AppData\Local\Android\Sdk\platform-tools
创建项目:
d:
cd /
npx @react-native-community/cli init ReactNativeTestProject
输出:
√ Downloading template
√ Copying template
√ Processing template
√ Installing dependencies
Run instructions for Android:
• Have an Android emulator running (quickest way to get started), or a device connected.
• cd "D:\ReactNativeTestProject" && npx react-native run-android
Run instructions for Windows:
• See https://microsoft.github.io/react-native-windows for the latest up-to-date instructions.
连接手机(开启usb调试,仅充电),需要授权, 参考: https://reactnative.cn/docs/running-on-device
cd ReactNativeTestProject
adb devices
List of devices attached
10CFBD1TXxxxxxx unauthorized
adb devices
List of devices attached
10CFBD1TXxxxxxx device
第一次运行测试可能需要用代理安装缺失组件:
cd ReactNativeTestProject
yarn add react-native-cli
npx react-native run-android
gradle下载问题:
编辑 D:\ReactNativeTestProject\android\gradle\wrapper\gradle-wrapper.properties 文件
将
distributionUrl=https\://services.gradle.org/distributions/gradle-9.0.0-bin.zip
替换为
distributionUrl=https\://mirrors.cloud.tencent.com/gradle/gradle-9.0.0-bin.zip
安装 IntelliJ IDEA
安装插件:
进入IntelliJ IDEA的插件市场,搜索并安装以下插件:
React Native
JavaScript
Node.js
配置运行环境:
在IntelliJ IDEA中,点击“Run”菜单,选择“Edit Configurations”。
添加一个新的“Node.js”配置,设置“JavaScript file”为项目目录下的index.js。
在“Application parameters”中添加android,以便启动安卓模拟器。
打包
参考: https://reactnative.cn/docs/signed-apk-android
d:
cd D:\ReactNativeTestProject\
C:\jdk-17.0.9+9\bin\keytool.exe --genkeypair --v --storetype PKCS12 --keystore my-release-key.keystore --alias my-key-alias --keyalg RSA --keysize 2048 --validity 10000
输入密钥库口令:mishikukouling
再次输入新口令:mishikukouling
您的名字与姓氏是什么?
[Unknown]: Ming Xing
您的组织单位名称是什么?
[Unknown]: ORG Name
您的组织名称是什么?
[Unknown]: ORG Name
您所在的城市或区域名称是什么?
[Unknown]: City
您所在的省/市/自治区名称是什么?
[Unknown]: Province
该单位的双字母国家/地区代码是什么?
[CN]: CN
CN=Ming Xing, OU=ORG Name, O=ORG Name, L=City, ST=Province, C=CN是否正确?
[否]: Y
正在为以下对象生成 2,048 位RSA密钥对和自签名证书 (SHA256withRSA) (有效期为 10,000 天):
CN=Ming Xing, OU=ORG Name, O=ORG Name, L=City, ST=Province, C=CN
[正在存储my-release-key.keystore]
这条命令会要求你输入密钥库(keystore)和对应密钥的密码,然后设置一些发行相关的信息。最后它会生成一个叫做my-release-key.keystore的密钥库文件。
在运行上面这条语句之后,密钥库里应该已经生成了一个单独的密钥,有效期为 10000 天。–alias 参数后面的别名是你将来为应用签名时所需要用到的,所以记得记录这个别名。
注意:请记得妥善地保管好你的密钥库文件,一般不要上传到版本库或者其它的地方。
- 把my-release-key.keystore文件放到你工程中的android/app文件夹下。
- 编辑项目目录/android/gradle.properties(项目配置,只对所在项目有效),添加如下的代码(注意把其中的****替换为相应密码)
MYAPP_RELEASE_STORE_FILE=my-release-key.keystore
MYAPP_RELEASE_KEY_ALIAS=my-key-alias
MYAPP_RELEASE_STORE_PASSWORD=mishikukouling
MYAPP_RELEASE_KEY_PASSWORD=mishikukouling
- 编辑你项目目录下的android/app/build.gradle
...
android {
...
defaultConfig { ... }
signingConfigs {
release {
storeFile file("D:/ReactNativeTestProject/android/app/my-release-key.keystore") // 确保路径正确
storePassword "mishikukouling"
keyAlias "my-key-alias"
keyPassword "ymishikukouling"
}
}
buildTypes {
release {
...
signingConfig signingConfigs.release
}
}
}
...
生成发行 APK 包:只需在终端中运行以下命令
cd android
gradlew assembleRelease
生成的 APK 文件位于android/app/build/outputs/apk/release/app-release.apk,它已经可以用来发布了。
默认apk大小46M+,安装后48M+。
启用 Proguard 来减少 apk 的大小(可选):修改android/app/build.gradle文件
/**
* Run Proguard to shrink the Java bytecode in release builds.
*/
def enableProguardInReleaseBuilds = true
apk 大小 43M+,安装后约 46M,没减少多少啊…