Linux React-Native Android开发环境搭建,附报错信息

参考:http://wiki.jikexueyuan.com/project/react-native/GettingStarted.html

1. 安装nvm

参考:https://github.com/creationix/nvm#installation

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.29.0/install.sh | bash

测试nvm命令: nvm -version

2. 安装linuxbrew, homebrew for linux;

参考:http://brew.sh/linuxbrew/

git clone https://github.com/Homebrew/linuxbrew.git ~/.linuxbrew

Add to your .bashrc or .zshrc:

export PATH="$HOME/.linuxbrew/bin:$PATH"export MANPATH="$HOME/.linuxbrew/share/man:$MANPATH"export INFOPATH="$HOME/.linuxbrew/share/info:$INFOPATH"

brew基本操作:

% brew search <pkg> # 搜索包

% brew install <pkg> # 安装包

% brew uninstall <pkg> # 删除包

% brew list <pkg> # 列出 pkg 的文件

% brew info <pkg> # 关于 pkg 的信息

% brew update # 更新包

% brew upgrade <pkg> # 升级包

3. 安装node;

nvm install node && nvm alias default node

这里要等 一段时间,下载会有点慢;

4. 安装watchman和flow

$ brew install watchman

$ brew install flow

pywatchman/bser.c:31:20: fatal error: Python.h: No such file or directory

#include <Python.h>

^

compilation terminated.

error: command '/usr/bin/gcc-4.8' failed with exit status 1

make[1]: *** [py-build] Error 1

make[1]: *** Waiting for unfinished jobs....

make[1]: Leaving directory `/tmp/watchman20151026-14785-1hs3pkk/watchman-3.9.0'

make: *** [all] Error 2

READ THIS: https://github.com/Homebrew/linuxbrew/blob/master/share/doc/homebrew/Troubleshooting.md#

一看就是没装python,安装python sudo apt-get installpython-dev

装flow又报错了,又是缺少东西; 到http://flowtype.org/网站看看这个flow是什么东西(需要饭枪)

Flow is a static type checker, designed to find type errors in JavaScript programs:

https://github.com/facebook/flow, 原来是 依懒ocaml libbelf-dev。执行下面操作:

sudo apt-get install ocaml libelf-dev

http://flowtype.org/docs/getting-started.html

mv hh_shared.o hack/heap/hh_shared.o

ocamlopt -ccopt -DNO_LZ4 -c hack/hhi/hhi_elf.c

+ ocamlopt -ccopt -DNO_LZ4 -c hack/hhi/hhi_elf.c

hack/hhi/hhi_elf.c:26:18: fatal error: gelf.h: No such file or directory

#include <gelf.h>

^

compilation terminated.

Command exited with code 2.

make: *** [build-flow-native-deps] Error 10

READ THIS: https://github.com/Homebrew/linuxbrew/blob/master/share/doc/homebrew/Troubleshooting.md#troubleshooting

5. 运行demo

首先切换到你想要的目录下,依次执行以下命令

$ npm install -g react-native-cli

$ react-native init AwesomeProject

$ cd AwesomeProject/

运行项目

$ react-native run-android

wv@wv-ThinkPad-SL ~/code $ react-native init react_native_android_test

This will walk you through creating a new React Native project in /home/wv/code/react_native_android_test

Installing react-native package from npm...

^[^[Setting up new React Native app in /home/wv/code/react_native_android_test

To run your app on iOS:

Open /home/wv/code/react_native_android_test/ios/react_native_android_test.xcodeproj in Xcode

Hit Run button

To run your app on Android:

Have an Android emulator running, or a device connected

cd /home/wv/code/react_native_android_test

react-native run-android

如果你react-natve run-android之后看到一个红色列表,就是因为没有启动server, React-native会在电脑上启动一个server,

你在手机上跑的应用就是一个客户端,启动server如下:

在命令行启动 Debug Server 即可:在工程目录下

react-native start

还有就是要配置一下电脑的IP,你的电脑必须我你的手机在一个局域网里面。

按Menu键(或者摇一摇)出现菜单,选择Dev sttings -> Debug server host for device 填写你电脑的IP

再重新选择reload JS看看。

index.android.js改一行代码看看:

var react_native_android_test = React.createClass({

render: function() {

return (

<View style={styles.container}>

<Text style={styles.welcome}>

Welcome to React Native!

我的第一个应用

</Text>

<Text style={styles.instructions}>

To get started, edit index.android.js

</Text>

<Text style={styles.instructions}>

Shake or press menu button for dev menu

</Text>

</View>

);

}

});

浏览器React Developer Tools

Chrom: https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi/related

FireFox: https://addons.mozilla.org/en-US/firefox/addon/react-devtools/

React_Server启动报错:

React packager ready.

ERROR A non-recoverable condition has triggered. Watchman needs your help!

The triggering condition was at timestamp=1447577488: inotify-add-watch(/home/wv/work/qianmi/d2papp/node_modules/bufferutil/build/Release/.deps/Release) -> The user limit on the total number of inotify watches was reached; increase the fs.inotify.max_user_watches sysctl

All requests will continue to fail with this message until you resolve

the underlying problem. You will find more information on fixing this at

https://facebook.github.io/watchman/docs/troubleshooting.html#poison-inotify-add-watch

{"watchmanResponse":{"version":"3.9.0","error":"A non-recoverable condition has triggered. Watchman needs your help!\nThe triggering condition was at timestamp=1447577488: inotify-add-watch(/home/wv/work/qianmi/d2papp/node_modules/bufferutil/build/Release/.deps/Release) -> The user limit on the total number of inotify watches was reached; increase the fs.inotify.max_user_watches sysctl\nAll requests will continue to fail with this message until you resolve\nthe underlying problem. You will find more information on fixing this at\nhttps://facebook.github.io/watchman/docs/troubleshooting.html#poison-inotify-add-watch\n"}}

Error: A non-recoverable condition has triggered. Watchman needs your help!

The triggering condition was at timestamp=1447577488: inotify-add-watch(/home/wv/work/qianmi/d2papp/node_modules/bufferutil/build/Release/.deps/Release) -> The user limit on the total number of inotify watches was reached; increase the fs.inotify.max_user_watches sysctl

All requests will continue to fail with this message until you resolve

the underlying problem. You will find more information on fixing this at

https://facebook.github.io/watchman/docs/troubleshooting.html#poison-inotify-add-watch

at ChildProcess.<anonymous> (/home/wv/code/react_native_android_test/node_modules/react-native/node_modules/sane/node_modules/fb-watchman/index.js:202:17)

at emitTwo (events.js:87:13)

at ChildProcess.emit (events.js:172:7)

at maybeClose (internal/child_process.js:818:16)

at Socket.<anonymous> (internal/child_process.js:319:11)

at emitOne (events.js:77:13)

at Socket.emit (events.js:169:7)

at Pipe._onclose (net.js:469:12)

See http://facebook.github.io/react-native/docs/troubleshooting.html

for common problems and solutions.

主要问题:The user limit on the total number of inotify watches was reached; increase the fs.inotify.max_user_watches sysctl

Google: https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers 解决

$ cat /proc/sys/fs/inotify/max_user_watches

8192

$ sudo sysctl fs.inotify.max_user_watches=524288

[sudo] password for wv:

fs.inotify.max_user_watches = 524288

$ sudo sysctl -p

$ cat /proc/sys/fs/inotify/max_user_watches

524288

永久修改:

$ echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf

fs.inotify.max_user_watches=524288

$ sudo sysctl -p

fs.inotify.max_user_watches = 524288

watchman shutdown-server

brew update

brew reinstall watchman

上面重装应该不是必需的,要关闭命令行重新打开,再进入工程目录 下

react-native start