React Native 学习笔记(一)---Hello, New World!

React Native 学习笔记(一)—Hello, New World!

Taylor Guo, 2017年9月8日

因为需要开发一款app,没有任何移动端开发和前端开发经验,只需要结果。先看了Swift,虽然比OC简单很多,但仍然不那么直觉。Swift从零开始,估计有经验的人也需要2个月的时间,更何况是我这种没有任何现代语言经验的人了。

和一个后端同事交流了一下,他建议说用React Native上手快,开发便利,先不管坑不坑儿的了,不管三七二十一,直接上来就干。

B站上看了一天教学视频,感觉RN上手比较快,又符合直觉,又在GitHub上看了一下对UI的支持,觉得应该能把自己需要的APP做出来。所以今天晚上就开始搭建系统了。


系统搭建

直接参考了中文官网教程

结果,一上来就给了我一个下马威,模拟器无法正常运行,Helloworld程序也无法打开。

错误提示如下:
react-native启动报错-Print: Entry, “:CFBundleIdentifier”, Does Not Exist

问题:
一直没有找到答案;

百度+Google后,在慕课网上看到别人的分析,
联想到之前Ubuntu下面调试C++项目;

干活之前,必先祭系统:

  • 更新:brew update 这会更新 Homebrew 自己,并且使得接下来的两个操作有意义——

  • 检查过时(是否有新版本):brew outdated 这回列出所有安装的软件里可以升级的那些

  • 升级:brew upgrade 升级所有可以升级的软件们

  • 清理:brew cleanup 清理不需要的版本极其安装包缓存

更新之后还是没有找到答案。

于是再次寻找答案:React Native版本有问题。

按照方案一:修改了package.json文件中的版本信息。仍然提示错误。


根据命令行提示进行操作:

1.lsof -n -i4TCP:8081 列出被占用的端口列表

2.kill -9 找到与之对应的PID然后删除即可

3.重新运行项目 react-native run-ios


如果还有一下问题:

PhaseScriptExecution Install\ Third\ Party /Users/taylorguo/Documents/React-Native/QiQiabc/QiQiabc/ios/build/Build/Intermediates/React.build/Debug-iphonesimulator/double-conversion.build/Script-190EE32F1E6A43DE00A8543A.sh

(1 failure)

Installing build/Build/Products/Debug-iphonesimulator/QiQiabc.app
An error was encountered processing the command (domain=NSPOSIXErrorDomain, code=2):
Failed to install the requested application
An application bundle was not found at the provided path.
Provide a valid path to the desired application bundle.
Print: Entry, “:CFBundleIdentifier”, Does Not Exist

Command failed: /usr/libexec/PlistBuddy -c Print:CFBundleIdentifier build/Build/Products/Debug-iphonesimulator/QiQiabc.app/Info.plist
Print: Entry, “:CFBundleIdentifier”, Does Not Exist

针对iOS React Native 0.45版本以后,这是因为第三方库的问题,没有安装好。

通过third party .sh文件可以看到他们需要的第三方库,下载即可。

这里写图片描述

将下载的库拷贝到~/.rncache目录下即可

cd ~
mkdir .rncache
这里写图片描述

也可以参考:
iOS RN 0.45以上版本所需的第三方编译库(boost等)


改用方案二
用–version参数创建指定版本的项目。
react-native init Demoapp –version 0.44.3 版本号必须精确到两个小数点

至此,React Native终于运行成功!
这里写图片描述


也可以使用create-react-native-app来创建App。

这里写图片描述

参考资料:

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章