从六点下班,搭建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就出来了。
原文链接:https://www.f2er.com/react/305048.html