React Native

因为项目上的需求,要调研下React Native,参考

安装

按官网的介绍,先安装node,因为我之前安装过node,导致一直报错,没办法,先把homebrew卸载了,再重新安装

卸载Homebrew

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/uninstall)"

安装Homebrew

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

安装node

brew install node

但提示如下的错误
错误
按照提示,尝试使用 rm '/usr/local/include/node/common.gypi'
再使用brew link --overwrite node,还是会提示错误
错误
网上说是权限的问题,使用命令sudo chown -R $(whoami):admin /usr/local,会提示chown: /usr/local: Operation not permitted
使用sudo chown -R $(whoami) /usr/local/*命令就OK了

然后再使用 brew link --overwrite node

安装watchman

Watchman则是由 Facebook 提供的监视文件系统变更的工具。安装此工具可以提高开发时的性能(packager 可以快速捕捉文件的变化从而实现实时刷新)

brew install watchman

创建应用

如果你之前全局安装过旧的react-native-cli命令行工具,请使用npm uninstall -g react-native-cli卸载掉它以避免一些冲突。

使用命令npx react-native init AwesomeProject来生成一个新的工程,如下图所示

新建应用
pod install又出了错误,按照提示,使用如下的命令

cd ./AwesomeProject/ios && pod install

还是会提示错误,这是Cocoapods的原因
错误提示
使用pod repo remove trunk 命令,移除trunk

再次并多次使用pod install后,提示如下的错误

xcrun
这里的错误我理解的是:因为在上面的步骤中,重新下载了Command Line Tools,所以需要重新配置下。在Xcode的Preferences中,选择Command Line Tool

command line tools
然后再重新pod install,就成功了,效果如下

succ
项目目录如下:

目录结构
运行demo,效果如下:

demo

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐