文章目錄
  1. 1. 安装测试
  2. 2.
    1. 2.1. node路径 问题
    2. 2.2. 真机测试Bug
    3. 2.3. ES6

安装测试

RN发展的非常非常快,在我写这篇文章(7月22日 星期五)的时候已经更新到0.30版本了

版本发展的太快,导致新手在使用RN时,参考的文档会不可避免的发生一些版本更迭导致的错误(比如语法全面转向ES6等),下面就以0.30为例,我重新写一个RN项目,取名为bitch

首先更新RN版本

1
sudo npm install -g react-native-cli

测试安装

1
2
react-native init bitch
cd bitch

查看package.json

1
2
3
4
5
6
7
8
9
10
11
12
13
~/workspace/reactnative/bitch » cat package.json
{
"name": "bitch",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start"
},
"dependencies": {
"react": "15.2.1",
"react-native": "0.30.0"
}
}

直接运行iOS模拟器脚本

1
react-native run-ios

可能会卡一段时间,当前会执行安装iOS APP的脚本,另一个弹出的是node后端,关于所有APP的信息都放在这个服务器上。之后毫无疑问的,渲染出来一个iPhone6的界面应用

然后官方文档就开始撒花了。(懵逼

node路径 问题

我们在使用xcode进行应用安装时,如果你是一个好的jser,会使用nvm(node version manager)管理node版本,但是通过修改.zshrc加入node环境变量启动的话,shell会找不到node命令,xcode会显示build failed,此时要到项目的Build Phases 里去找到shell中的node路径,具体可以通过where node or which node命令查看

真机测试Bug

关于真机调试,中文官方文档是这样说的:
http://reactnative.cn/docs/0.28/debugging.html#content
然而实际上要到AppDelegate.m去修改localhost为本机IP才会生效,修改RCTWebSocketExecutor.m没有实质作用(0.27版本),然而在0.30版本里似乎进行了优化,代码优化如下:

RCTWebSocketExecutor.m

Before

After

测试之后,发现似乎是真机调试时主动把本机IP自动替换localhost,因此不需要修改任何代码就可以进行真机调试

iPhone截图

但是0.30版本前的项目还是会有这个坑。可以通过

1
2
npm install --save react-native@0.30
react-native upgrade

进行项目更新

实际上,你的app只是一个js解释器,我可以在用一台服务器上开不同的后台让它变成不同的app,只要按装好一次app,就告别Xcode,用你喜欢的编辑器,比如vim,进行iOS的APP编写了。

ES6

其实这个不算一个坑,因为现在ES5是被兼容的。作为一个prototype的忠实用户,对于所有的oo语言是无法接受的,何必要包上一层糖纸去迎合那些没有class就活不下去的人呢?ES6的到来完全抢走了JS各种方言的饭碗,像之前很多人推荐的CoffeeScript、TypeScript。我大原型链指针灵活,继承自由,现在被强行规范化了。rn马上也要抛弃es5了,如果你没有接触过es5的话,那这个就不是一个坑,自动忽视掉之前版本的教程、官方/非官方例子就好。慢慢的习惯每个自定义view都用上class和它的构造函数吧。

文章目錄
  1. 1. 安装测试
  2. 2.
    1. 2.1. node路径 问题
    2. 2.2. 真机测试Bug
    3. 2.3. ES6