1、node
Node 的版本应大于等于 14,但是自己是WIN7系统,安装不了。所以需要按照一下步骤操作:
(1)下载node 14版本,记住一定要下载ZIP结尾的,我下载的是v14.15.0版本。
(2)解压压缩包,覆盖替换到旧的安装目录。我的是C:\Program Files\nodejs
(3)打开命令行,输入 set NODE_SKIP_PLATFORM_CHECK=1,执行它,其作用是忽略平台审查,并设置系统变量NODE_SKIP_PLATFORM_CHECK=1
(4)检查node版本:node -v v14.15.0
2、JDK
React Native 需要 Java Development Kit [JDK] 11,但是公司无法使用Oracle的Java,所以只能安装openJDK,下载路径:https://download.java.net/java/ga/jdk11/openjdk-11_windows-x64_bin.zip
(1)解压到自己指定目录,我的放在D:\tool\jdk-11
(2)设置系统变量JAVA_HOME=D:\tool\jdk-11,并加入到path中
(3)检查版本:javac -version 显示javac 11
3、Android Studio
(1)官网下载:https://developer.android.google.cn/studio/
(2)在安装的过程中,总是要选择java目录,并且怎么设置都显示找不到java.exe。后通过安装了Oracle的Java之后,就可以顺利安装了。安装成功之后,删除Oracle的java。
(3)打开Android Studio,设置openJDK目录:File--->Project Structure--->点击右侧的Gradle Settings--->弹框中选择Gradle JDK的目录为:Android Studio java home version 11 D:\tool\jdk-11
4、使用Android模拟器
首先需要创建一个虚拟设备,创建好了再连接的过程中,一直提示需要安装HAXM,但是一直安装不成功,网上各种方法都尝试了,最终通过在Android Studio的安装目录直接点击exe程序安装即可,我的目录为:D:\tool\Android SDK\extras\intel\Hardware_Accelerated_Execution_Manager中的haxm-7.6.5-setup.exe
5、启动项目
(1)yarn android时报错: java.io.IOException: Unable to delete directory 'D:\demo\AwesomeProject\MyTest\android\app\build\intermediates\dex\debug\mergeLibDexDebug'
error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':app:dexBuilderDebug'.
> java.io.IOException: Unable to delete directory 'D:\demo\AwesomeProject\LuckProject\First\android\app\build\intermediates\project_dex_archive\debug\out'
解决:直接删除了对应目录下的build文件夹
(2)再次yarn android时报错:unable to load script make sure you're either running a metro server...
查阅文档说是要先使用:yarn start---->又报端口占用的错,干掉占用端口,再次yarn start,项目成功启动。
6、yarn android时,node程序报错闪退
项目之前启动都是OK的,但是电脑强制重启之后,发现无法启动了,各种网上给的方法都不行,后面通过netstat -ano|findstr 8081 把端口都干掉之后,重启就正常了,为什么会出现这种情况,未知。。。。。
7、react-native-debugger
默认的debugger-ui只能看一些console的内容,发现network看不了请求信息,需要修改配置文件,步骤如下:
(1)下载后打开工具,在工具栏的Debugger中找到open config file打开配置文件
(2)修改配置文件中的defaultNetworkInspect选项(将永久启用网络检查)。设置为true
(3)重新加载reload模拟器后即可查看network,成功!
8、dev server returned error code 403 react native
APP 启动成功,但是一直模拟器一直报403
(1)切换端口
yarn react-native start --port=8088
(2)成功启动之后,在模拟器中Ctrl+M,选择Change Bundle Location,编辑为:localhost:8088,然后reload,这时候浏览器可以访问到http://localhost:8088/debugger-ui/
(3)建立连接
adb devices
建立连接:
adb -s emulator-5554 reverse tcp:8088 tcp:8088
emulator-5554 换成adb devices 的名字
(4)模拟器中reload,但是报错timeout while connecting to remote debugger
在模拟器中Ctrl+M,选择Debug,重新bundle之后,成功运行了
9、React Navigation
(1)根据React Navigation官网中,操作安装指定依赖包
"@react-navigation/native": "6.0.10",
"@react-navigation/native-stack": "6.2.1",
"react-native-safe-area-context": "3.3.2",
"react-native-screens": "~3.10.1"
安装依赖包启动时,报错:
Execution failed for task ':app:compileDebugKotlin'.
解决:在android/build.gradle文件中,添加如下代码:
buildscript {
ext {
kotlinVersion="1.5.31"
}
}
然后重启,Run app,会报错:Error: Error Launching activity,此时只需要点击Run app旁边的按钮(Apply Changes an Restart Activity即可)
网友评论