一、准备软件
1.安装Node.js
官网下载:http://nodejs.cn/download/,之后安装,新版本不用配置环境变量。
查看版本
如图所示即为安装成功。
2.安装Java SE
官网下载:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
配置环境变量:
a.计算机 → 属性 → 高级系统设置 → 高级 → 环境变量
b.系统变量 → 新建 JAVA_HOME 变量 ,变量值填写 jdk 的安装目录。
c.系统变量 → path → 变量值输入 %JAVA_HOME%\bin;%JAVA_HOME%\jre\bin; ,注意末尾的分号。
d.系统变量 → 新建 CLASSPATH 变量。变量值填写.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\tools.jar(注意最前面有一点)
查看版本
如图所示即为安装成功。
3.安装React-Native Cli
打开cmd,输入
npm install -g react-native
查看版本,cmd下输入
npm info react-native
如图所示即为安装成功。
ps: npm淘宝镜像
第一步,找到nodejs的安装目录 例如 C:\Program Files\nodejs\node_modules\npm,并找到 npmrc 文件
第二步,打开npmrc文件,添加
registry=https://registry.npm.taobao.org
效果如下:
prefix=${APPDATA}\npm
registry=https://registry.npm.taobao.org
4.安装Android Stdio
下载地址:http://www.android-studio.org/index.php/download/hisversion
2.0以上的版本都支持react-native
a.软件设置
b.环境变量设置
1)新建ANDROID_HOME, 变量值为Android SDK的路径。
2)path变量值添加
%ANDROID_HOME%\platforms;%ANDROID_HOME%\platformtools;%ANDROID_HOME%\tools;\
二、创建react-native 项目
1.新建一个文件夹 ,例如reactDemo
2.初始化,进入项目目录后,输入
react-native init reactDemo
成功后:
3.运行package
cmd输入
react-native start
报错,制定端口运行,成功
react-native start --port=8082
4,打开模拟器
推荐1:bluestacks 下载地址:http://www.bluestacks.cn/
推荐2:Genymotion 下载地址:链接:http://pan.baidu.com/s/1dEDqdo9 密码:93y8
5.模拟器安装之后,运行项目
react-native run-android
三、运行的各种错误的解决方案
错误1. unable to load script form assets
解决方案:
a. 先手动在main下建立一个assets文件夹(路径:react项目名\android\app\src\main)
b. cmd到项目下输入:
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
错误2. Command run-android unrecognized. Make sure that you have run npm install and that you are inside a react-native project.
解决方案:
在cmd中运行下面的命令
npm add react-native-cli
错误3
...未完待续...