环境配置:(针对android)
- 安装node.js 配置国内镜像 安装react native的命令行
- 安装java8或以上
- 安装Android studio 并且sdk 中的Android版本必须有23.0.1
- 初始化我们的第一个reactNative项目
第一步:
从node.js官网下载对应的安装包
下载好一路安装就行。验证是否安装成功win+R 输入cmd 打开终端,按如图所示输入验证
接下来就是安装React Native 的命令行工具 :
安装完node后建议设置npm镜像以加速后面的过程(或使用科学上网工具)。注意:不要使用cnpm!cnpm安装的模块路径比较奇怪,packager不能正常识别!
npm config set registry https://registry.npm.taobao.org --globalnpm config set disturl https://npm.taobao.org/dist --global
Yarn、React Native的命令行工具(react-native-cli)
是Facebook提供的替代npm的工具,可以加速node模块的下载。React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务。
npm install -g yarn react-native-cli
安装完yarn后同理也要设置镜像源:
yarn config set registry https://registry.npm.taobao.org --globalyarn config set disturl https://npm.taobao.org/dist --global
具体截图如下:
到这里,我们第一步就完成了,第二步是为了安装APP而准备的运行环境 java和sdk
第二步:
下载java8或以上(必须是8 或以上)一路默认安装就行。安装android studio 之后看这个图
在SDK Tools窗口中,选择Show Package Details,然后在Android SDK Build Tools中勾选Android SDK Build-Tools 23.0.1(必须是这个版本)。然后还要勾选最底部的Android Support Repository.(最好是关于23.0.1的都下载下来)
ANDROID_HOME环境变量:
确保ANDROID_HOME环境变量正确地指向了你安装的Android SDK的路径。
打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 环境变量 -> 新建
具体的路径可能和下图不一致,请自行确认。
你需要关闭现有的命令符提示窗口然后重新打开,这样新的环境变量才能生效。
android Sdk环境和tool:
你可以把Android SDK的tools和platform-tools目录添加到PATH变量中,以便在终端中运行一些Android工具,例如android avd或是adb logcat等。
打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 环境变量 -> 选中PATH -> 双击进行编辑
注意你的具体路径可能和下图不同
第三步:
创建我们第一个的reactNative应用:(test就是你要创建的工程名)
接下来,你就是需要等待了,可能要几分钟,知道出现如图:
此图代表创建项目成功,接下来就是要在项目的目录下运行工程
运行app需要手机或模拟器,先看看有没有连接上,输入(adb devices)
此时已经有机子可以测试了,用命令去运行工程 react-native run-android,在运行时会启动包管理服务器,需要重启只需要在终端输入:react-native start 。(可能会出现安装不成功,如果是以下如图原因,最好换个手机或模拟器。)
这里还要提醒一下:在手机系统5.0以上需要输入:adb reverse tcp:8081 tcp:8081。这样App才能访问到包服务器资源。5.0以下需要在应用下设置路由并同一个wifi(很麻烦)建议采用5.0以上
,