ReactNative学习笔记(一)

96
朱敏_ITer
2017.09.10 15:36* 字数 579

一.ReactNative 环境搭建

1.参考指南

reactnative.cn/docs/0.48/getting-started.html#content 

ReactNative 中文网,集成步骤详细,按步骤一步步来,这里就不赘述了。

2.遇到的问题

如果你按照上述步骤走完,恭喜你,RN环境搭建完成了!

但是你很可能会遇到以下问题!

问题一:如果你使用Xcode打开工程并运行的话,会报如下错误



报错的原因是react的依赖没有添加成功

解决办法参考问题二

问题二:如果你用终端执行 react-native run-ios命令运行项目的话,会报如下错误


这是因为,从react0.45版本以后需要下载boost编译,而外网被和谐了。

解决办法:

方法一:在工程所在目录,打开package.json,做如下修改


将版本改为0.44.3

修改完成之后,commond+s保存文件,然后删除node_modules文件夹

在终端执行命令:npm install

最后执行命令:react-native run-ios 或者使用Xcode打开工程并运行

方法二:重新创建工程

步骤1:react-native init AwesomeProject --version 0.44.3

步骤2:cd AwesomeProject

步骤3:react-native run-ios  或者使用Xcode打开工程并运行

BUILD SUCCEEDED!!!





二.开发工具的选择

1.WebStorm(本人使用中,详细介绍)

2.Sublime Text

3.官方开发工具Nuclide

WebStorm打开React Native的正确姿势

步骤一:导入你所创建的React Native工程

步骤二:下载ReactNative.jar包 并导入

下载方法:  打开终端,cd到指定文件夹,例如cd Desktop  ,然后输入命令:

git clone https://github.com/virtoolswebplayer/ReactNative-LiveTemplate

导入jar包:File->Default Settings->ReactNative.jar

步骤3:设置.js文件默认以jsx的语法打开


步骤4:勾选ECMAScript-6


完成这些操作以后,就不会有黄色或者红色的警告了,还具备了代码补全提示功能。

本人也是RN新手一枚,写下此篇只为记录成长,文笔有限,还请多指教!

ps: 提供一个链接,非常全的ReactNative 问题集锦

www.jianshu.com/p/98c8f2a970eb


日记本
Web note ad 1