React Native HelloWorld for mac

从六点下班，搭建RN环境，到iOS和Android项目的Hello World出现，已经四个小时过去了。

简单记录一下步骤，网上教学资料一大堆，我就不再来一遍了，我只是把我的步骤和遇到的问题记录一下。方便以后查看。

首先去中文官网看：http://www.reactnative100.com/docs/getting-started.html

1.先去这里：http://brew.sh/ 安装Homebrew

2.安装后在终端，通过安装的Homebrew安装node，和watchman:

brew install node

brew install watchman

3.因为总会出现权限问题，所以安装rn命令行工具的时候我直接输入的：

sudo npm install -g react-native-cli

4.基本工具和环境好了，Android和iOS环境我已经配置好了。这步骤略。。。

5.下面开始初始化工程了。这里遇到问题了，有时候会拉不下来工程，所以直接换成淘宝的国内镜像：

npm config set registry https://registry.npm.taobao.org --global

npm config set disturl https://npm.taobao.org/dist --global

react-native init “工程名字”

7.这时候创建工程失败了，可以尝试升级你的npm，因为我的npm是去年安装的，所以升级过后工程创建就成功了。

sudo npm update npm -g

升级过后重新创建：react-native init “工程名字”

也可以使用命令来打包运行。

这里有个问题，ios运行没问题。当我运行在android手机上时，红屏，显示could not get BatchedBridge

最后找到解决办法：

1）.在工程目录下最外层有个package.json文件。打开后，在"scripts"中添加

"bundle-android":"react-native bundle --platform android --dev false --entry-file index.android.js

--bundle-output android/app/src/main/assets/index.android.bundle --sourcemap-output

android/app/src/main/assets/index.android.map --assets-dest android/app/src/main/res/"

2）.在android项目目录结构中新建assets文件夹，有就不用建了。

3）.在终端运行：react-native bundle --platform android --dev false --entry-file

index.android.js --bundle-output android/app/src/main/assets/index.android.bundle

--assets-dest android/app/src/main/res/

运行过后去assets目录下看看，多了两个文件，这步的作用是将工程android.js编译到android工程下的assets文件下。

这时在运行到手机上，Hello World就出来了。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!