react-native学习(一)

来源:互联网 发布:电脑摄像头监控软件 编辑:程序博客网 时间:2024/06/02 17:11

学习了一段时间的react-native之后,便有些跃跃欲试的赶脚。总体感觉良好,实际战斗力有待实践检测……

为了能边学习边实践,我找了个以前做好的小项目,打算用react-native来重新实现。其首页效果如下图


首先我们来实现首页,

创建工程:mac配置好react-native环境之后,运行react创建项目命令:react-native init newChild,时间会较长,需要有些耐心哦!


项目初始化完成之后,我们就得到了一个react-native项目。


目录结构如下:

打开ios文件夹,会发现工程文件newChild.xcodeproj,用xcode打开运行工程,然后悲剧了……遇见如下图所示莫名其妙错误:






原因:
新版本用的是babel 6版本,可是有些依赖的库并不是这个版本,就会导致这个错,所以解决方案就是把这个所以babel删了,升级依赖。

解决:

1,先删除依赖包:    rm -rf node_modules    ncu -u    npm install2,修改package.json文件     "scripts": {      "clean:babelrc": "find ./node_modules -name react-packager -prune -o -name '.babelrc' -print | xargs rm -f",      "postinstall": "npm run clean:babelrc"    }
 0  

按照上面方法修改,然后运行程序:


哎。本来以为今晚可以写完首页的实现方式的,结果搞出这个错误,今晚只能到这了,那下一篇我们先来实现tabbar吧!

react qq交流群:317120818


0 0
原创粉丝点击