React Native Install

2017-11-28

本指南归纳了基本的React Native环境安装方法和常见问题

基础库

windows

choco install python2
choco install adb
npm install -g react-native-cli

linux (deb)

sudo apt-get install python2
sudo apt-get install adb
sudo npm install -g react-native-cli

linux (centOS)

sudo yum install python2
sudo yum install adb
sudo npm install -g react-native-cli

node 和镜像源设置

只有没有安装过node的机器才需要进行这一步

windows

choco install nodejs.install
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
npm install -g yarn
yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global

linux (deb)

sudo apt-get install nodejs.install
sudo npm config set registry https://registry.npm.taobao.org --global
sudo npm config set disturl https://npm.taobao.org/dist --global
sudo npm install -g yarn
sudo yarn config set registry https://registry.npm.taobao.org --global
sudo yarn config set disturl https://npm.taobao.org/dist --global

linux (centOS)

sudo yum install nodejs.install
sudo npm config set registry https://registry.npm.taobao.org --global
sudo npm config set disturl https://npm.taobao.org/dist --global
sudo npm install -g yarn
sudo yarn config set registry https://registry.npm.taobao.org --global
sudo yarn config set disturl https://npm.taobao.org/dist --global

开启 Grandle Deamon

(if not exist "%USERPROFILE%/.gradle" mkdir "%USERPROFILE%/.gradle") && (echo org.gradle.daemon=true >> "%USERPROFILE%/.gradle/gradle.properties")

用 Android Studio 安装安卓 SDK

安装时需要确保安装的组件

SDK 和棉花糖的API 23是默认安装的

安装后需要追加的组件

事实上在 Android Studio 编译运行时,所依赖的组件会自动安装,但是我们用RN最好手动将需要的组件安装好

默认会安装 Build-Tools 23.0.3 等,如果不使用 React-Native 之外的其他版本可以卸载
注意!!! 几乎一定会有安装失败的包,观察错误信息重新安装即可。重复多次这个步骤直到所有的依赖项都安装完成。

windows 环境变量 (其他系统可以忽略)

安装模拟器

任选其一,也可以用Android Studio自带的模拟器

测试项目

react-native init someProject
cd someProject
react-native run-android

查看应用在模拟器中的日志

adb logcat *:S ReactNative:V ReactNativeJS:V

在真机运行

确定设备已经链接

adb devices

同时包括模拟器在内,你应该只链接一个设备

尝试运行

react-native run-android

链接调试服务器

Android 5.0 (KitKat) 以上版本

用reverse命令可以直接用默认设置链接服务器

adb reverse tcp:8081 tcp:8081

不光是安卓版本,其他玄学问题也有可能导致连接失败,尝试摇晃手机reload JS来确定已经连接成功

Android 5.0 (KitKat) 以下版本

先获得调试机的局域网ip

ipconfig

获得ip和端口号之后,执行以下步骤

补充:这种 init 的工程如何直接放置在 github 上

echo "anything" >> README.md
git init
git add .
git remote add origin https://github.com/somewhere.git
git push -u origin master
Go Back

随便看看 :D