前面主要是搭建了各种环境,虚拟机等等。本次主要是讲react-native入门搭建基础脚手架遇到的坑。。。
按照官方的说法,安装完各种环境以后直接安装脚手架,cd到所在目录直接就能运行进入到欢迎界面了。
npm install -g yarn react-native-cli
react-native init AwesomeProject
cd AwesomeProject
react-native run-android
我的电脑window的,按照对应的操作就无情的报错了,直接红屏。
Unable to resolve module ‘AccessibilityInfo’ 的异常
在 异常的返回的JSON 结构中给出了推荐的解决方法 :
This might be related to https://github.com/facebook/react-native/issues/4968\n
To resolve try the following:\n
1. Clear watchman watches: `watchman watch-del-all`.\n
2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.\n
3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`.
4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`."
结果是都不行的。根据网上的资源,这是版本的问题。
目前我所使用的默认版本:
react-native-cli: 2.0.1
react-native: 0.56.0
将版本换为以下版本:
react-native 0.55.4 ,
react-native-cli 1.2.0,
卸载之前默认的最新版本:
npm uninstall -g react-native-cli
npm uninstall -g react-native
安装替换的:
npm install -g [email protected]
npm install -g [email protected]
重新init脚手架:
react-native init --version="0.55.4" myFirstApp
再cd到myFirstApp,执行react-native run-android
等一会发现自动启动了一个node服务,第一次编译时间会稍长,过一会虚拟安卓机上就自动安装了一个应用,即myFirseApp,点击进去就是欢迎的界面了。
剩下的大家对着官方的api就可以独自练习了,我也是刚看了一点,在虚拟安卓机上,连续按两下r键就可以更新后的手机视图。