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

[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

时间: 2024-08-29 17:21:30

Linux React-Native Android开发环境搭建(附报错信息)的相关文章

react-native —— 在Mac上配置React Native Android开发环境排坑总结

配置React Native Android开发环境总结 1.卸载Android Studio,在终端(terminal)执行以下命令: rm -Rf /Applications/Android\ Studio.app rm -Rf ~/Library/Preferences/AndroidStudio* rm ~/Library/Preferences/com.google.android.studio.plist rm -Rf ~/Library/Application\ Support/A

linux下的Android开发环境搭建(2)

一.JDK的安装配置 在个人主文件夹下新建文件夹software,在software下新建java文件夹,用于存放各种android开发程序,本人用户名叫aaa,所以完整目录就是/home/aaa/ software/java 然后把jdk-7-linux-x64.gz复制到/home/aaa/software/java/目录下面,右键解压缩,会出现jdk-7-linux-x64文件,再次右键解压缩,出现jdk1.7.0文件夹,如图1-1: 图1-1 接下来配置开发环境,使用命令sudo ged

【转】在Windows下搭建React Native Android开发环境

http://my.oschina.net/jackzlz/blog/508210 安装JDK 从Java官网下载JDK并安装.请注意选择x86还是x64版本. 推荐将JDK的bin目录加入系统PATH环境变量. 安装Android SDK 可以单独安装Android SDK,也可以通过Eclipse ADT或者Android Studio一并安装.推荐使用Android Studio,以下说明会默认以Android Studio的方式说明.请注意选择x86还是x64版本. 为了加速下载,推荐从

手把手教你在Windows下搭建React Native Android开发环境

最近看到React Native好像好厉害的样子,好奇心驱使之下体验了一下并将在Window下搭建React Natvie Android环境的步骤记录下来,并有需要的朋友参考.(我都是参考官方文档的) react-native的GitHub地址:https://github.com/facebook/react-native react-native的文档地址:http://facebook.github.io/react-native/docs/getting-started.html 1.

在Windows上搭建React Native Android开发环境

安卓环境配置 安装JDK 安装完成后,使用命令行检查版本 java -version 安装Android Studio 以及SDK 下载AS和SDK,建议使用http://www.androiddevtools.cn/,这里整理得比较清晰,SDK下载可能要使用国内镜像,具体使用上面的网址有介绍. 这里需要注意设置环境变量ANDROID_HOME 1. 打开控制面板,选择系统和安全->系统->高级系统设置->高级->环境变量->新建,变量名填写ANDROID_HOME,变量值填

在Windows下搭建React Native Android开发环境

widows版本: win7 64位 专业版 1. 安装jdk.(我用的jdk7) 注意选择x86还是x64版本, 添加到系统PATH环境变量 2. 准备好android sdk 这个不多说,同时推荐使用android studio,模拟器推荐使用Genymotion,比自带的AVD要快很多. 3. 安装C++环境 可以直接安装Visual Studio 2013或2015,也可选择单独SDK,编译node.js的C++模块需要用. 4. 安装node.js 从官网下载node.js, 我下载的

react-native —— 在Mac上搭建React Native Android开发环境

需要:JDK,Android SDK,Node.js 1.安装JDK 去Java官网下载列表选择Mac OS X x64版 2.安装Android SDK 虽然现在谷歌推荐使用Android Studio,但是我还是选择了单独安装Android SDK. 这是一个比较全的目录,上面的链接是官方的,有wall,用下面的基本都是网盘资源,速度还可以,记得修改Android SDK在线更新镜像服务器. PS:在Android SDK Manager里要装API 23的 安装完成后,一定要设置环境变量:

react native windows开发环境搭建(二)

上一篇中介绍了本地服务器端环境的安装,使用已经编译好的apk程序,设置ip地址,就可以看到welcome界面,并且可以对程序做出修改以及调试. 为了扩展和发布应用 还需要能编译loader程序,这里介绍如何编译loader程序,实际上就是编译Android程序. ReactNative生成的项目是采用grader编译,eclipse无法编译,需要使用命令行或者导入android studio或者IntelliJ IDEA,这里将项目导入android studio. 1.首先如果没有安装jdk,

react native windows开发环境搭建(一)

ReactNative分为服务器端和手机端loader程序,Android版有3种代码:js代码,java代码和c++代码,主要是编写的是js代码,如果框架功能不足就需要编写原生的java代码来扩展,c++代码主要和js引擎有关,一般很少用到. 首先安装node.js服务器端,到node.js的网站上下载node.js然后安装上就可以了.https://nodejs.org/en/ 安装git,在执行命令的时候,需要通过git到github上去下载相关的文件. 下载地址如下:http://www

React Native IOS ---基础环境搭建(前端架构师)

React Native -IOS 开发环境搭建 web架构(基础) 安装依赖 * 必须安装的依赖有:Node.Watchman 和 React Native 命令行工具以及 Xcode. npm 镜像 npm config set registry https://registry.npm.taobao.org --global npm config set disturl https://npm.taobao.org/dist --global Yarn.React Native 的命令行工