react-native环境搭建,真机测试,遇到BUG以及解决方案
大家好,好久没有更新博客了,小苏几天研究了一个下午的react-native的环境搭建 在这过程中遇到了许多的问题,希望在这里给大家讲解一下遇到的问题跟解决问题的方案!
首先这里是官方给出的基础步骤
一定要全局安装react-native
npm install -g yarn react-native-cli
全局安装完react-native之后
下面我们就可以开始安装 Android Studio
国外的网站我们要翻墙才可以进去下载,我们可以自己百度去下载,比较简单这里就不多说了
安装了react-native之后我们就打开它
这时候我们就点击右下角的Configure 然后选中 SDK Manager
我们选择红色箭头的 Show Package Details
然后我们就可以点击Apply去自行下载了
然后我们就去设置系统的环境变量
变量值就是你SDK的安装目录
默认的安装目录是:c:\Users\你的用户名\AppData\Local\Android\Sdk
现在就暂时告一段落了;
下面我们就开始安装JDK Java SE Development Kit (JDK)
下载地址:(按照你电脑的环境安装相对应的文件)
https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
安装完之后我们就去设置环境变量
变量名:JAVA_HOME
变量值:C:\Program Files (x86)\Java\jdk1.8.0_91 // 要根据自己的实际路径配置
变量名:CLASSPATH (注意:如果使用1.5以上版本的JDK,不用设置CLASSPATH环境变量,也可以正常编译和运行Java程序。)
变量值:.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar; //记得前面有个"."
变量名:Path
变量值:%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;
例子:JAVA_HOME的变量值需要是你自己电脑安装的JDK的路径
下面我们就来创建一个react native的项目
在你的当前文件目录下打开控制台
Windows 用户请注意,请不要在某些权限敏感的目录例如 System32 目录中 init 项目!会有各种权限限制导致不能运行!
下面我们就来启动这个项目
cd 你的项目名称
在当前目录下执行 react-native run-android
注意一点,在创建我们的项目的时候就不会出现 index.android.js这个文件的所以我们要直接复制index.js的代码重新创建一个index.android.js这个文件将代码粘贴进去
出现的报错解决方案:
unable to load script from assets ‘index.android bundle’
在Android手机上运行React-native项目时
报错:unable to load script from assets ‘index.android bundle’ ,make sure your bundle is packaged correctly or youu’re runing a packager server
解决方案:
第一步:在 android/app/src/main 目录下创建一个 assets空文件夹
第二步:执行 下面这段命令
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/
会发现 assets文件夹下多出一个文件
第三步:重新run程序。
当出现react-native打包失败app:installDebug FAILED的报错时
在android/app/build.gradle加入下面这段代码
android {
compileSdkVersion 23
buildToolsVersion “23.0.1”
aaptOptions.cruncherEnabled = false
aaptOptions.useNewCruncher = false
react native之A problem occurred configuring project ‘:app’报错的解决方法
在react native项目中的 Android 文件夹下创建一个名为 local.properties 的文件(创建一个普通的txt文本文件,然后重命名为local.properties就行),用记事本打开,写入以下内容:
sdk.dir=你本地Android SDK文件夹路径,注意,路径中的所有单斜线\应该写成双斜线\
比如:sdk.dir=D:\AndroidSDKLocation
保存后再次执行 react-native run-android 即可。
好了今天的问题就到这里了,喜欢小苏的可以给小苏点个赞关注一下