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

Posted 2020-08-01 stewartlj

参考：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

[email protected] ~/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