美文网首页我爱编程
ReactNative环境配置初始化

ReactNative环境配置初始化

作者: 进阶的蚊子 | 来源:发表于2018-06-20 11:28 被阅读31次

加班加了太久 ,终于闲下来一周,写关于ReactNative的 ,这个也是面试最喜欢问到有没有做过的,当然啦实际工作中真的用到的不是很多,具体看公司了.
React Native 可以通过更新远端JS,直接更新app, 用 JavaScript 调起 native 组件,将增强与高性能组件交给 native 来处理 . 相比其他 hybrid 框架而言, ReactNative并非通过 webview 来调用原生组件,而是直接调用操作系统自带的 javascriptCore, 所以更高效。

环境配置
参考文档 http://facebook.github.io/react-native/

React Native 主要依赖以下环境:

Mac OS X操作系统
Xcode, 推荐使用7.3.0或者更高版本。
Node.js V6.2.1或者最新版本。
watchman和flow。
NVM

  1. xcode 这个mac 系统开发必备 直接去appstore 下载
    2.安装Node.js
    官网下载 https://nodejs.org/
179A13B4-275F-4141-B57E-3EF7698F6FC5.png
  1. 安装 Homebrew
    官网 https://brew.sh/index_zh-cn
90A90A1B-B556-4D2D-806C-319C5FA95A5B.png

从图我们可知需要在终端输入输入命令
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
运行有点耗时 耐心等待

B40CCD68-8332-4A31-9D0B-6F6A86D37231.png

4 .通过brew安装watchman和flow
React Native 包管理器使用了watchman ,flow是 Facebook 公司出品的一个类型检查库,它同样被 React Native 所采用.
安装好Homebrew 之后,依次运行以下命(比较耗时时):
//检查版本
brew -v
//安装watchman
brew install watchman
//安装 flow
brew install flow


453F43C9-7B14-4D73-8050-F1731D8E9C7B.png 80B16A95-E344-494B-8C8F-42D253A2D3B2.png

5.安装react-native-cli命令行工具
在MAC终端中输入如下命令,其中-g表示全局安装。
这个步骤将会在你的系统全局安装 React Native 命令行工具。[图片上传中...(FADBE80D-66BD-47B4-9216-67076BCA8EBF.png-99097e-1529464719169-0)]

sudo npm install -g react-native-cli


F1F6B551-22D8-4A6B-A2DA-5758FB6DF51E.png

6.安装 安装NVM
Reace Native 使用nvm管理不同的node和npm.

git clone https://github.com/creationix/nvm

安装成功后我们就可以开始建立项目测试了

先建立个文件夹RNDemo 为了方便 我就放在桌面
进入文件目录
然后输入react-native init HelloWorld 运行 有点慢 要有耐心 当然也可能是公司电脑太渣的原因 .....


02F36076-CCC9-4558-909D-7881EFBCDE3B.png

等待运行完成后 我们去目录查看下 一个工程就建立好了


B6326CAC-3830-42F6-B5AD-798E3B2B8207.png
0B5C9ABF-4AF3-45C2-9661-1CE1B5DB8C05.png

然后就可以愉快地进行RN编程了

相关文章

网友评论

    本文标题:ReactNative环境配置初始化

    本文链接:https://www.haomeiwen.com/subject/ajbtyftx.html